javascript 面向对象学习（一）——构造函数

最近在学习设计模式，找了很多资料也没有看懂，看到怀疑智商，怀疑人生，思来想去还是把锅甩到基础不够扎实上。虽然原型继承、闭包、构造函数也都有学习过，但理解得不够透彻，影响到后续提高。这次重新开始学习，一边记录总结，希望有所收获，如果能对一起学习的小伙伴有帮助就更好了。

第一篇先从构造函数谈起。构造函数顾名思义，是用来构造的，构造什么呢？构造对象。在 javascript 中，对象是拥有属性和方法的数据。举个简单的例子，如果把一个人看作一个对象，那么年龄、性别等就是它的属性，吃饭、睡觉等是它的方法。我们来创建一个 jack 对象：

var jack = {
    name: 'Jack',
    jump: function() {
        console.log('Jack-jump')
    }
}

如果我们想再创建一个 rose 对象，还需要把上面的代码再写一遍，而二人仅仅是名字不同。这时候我们会想到用一个函数来创建对象，对象名字可通过传参获取。

function createPerson(name) {
    var person = {}
    person.name = name
    person.jump = function() {
        console.log(name + '-jump')
    }
    return person
}

测试结果

var jack = createPerson('Jack')
jack.jump() // Jack-jump
var rose = createPerson('Rose')
rose.jump() // Rose-jump

这个函数可以满足我们的需求，但不够简洁，下面我们来看一下怎么利用构造函数来创建对象

function Person(name) {
    this.name = name
    this.jump = function() {
        console.log(this.name + '-jump')
    }
}

是不是简洁了很多？当我们需要创建具体人物时，使用 new 关键词来创建对象，创建出来的对象也叫做实例。

var jack = new Person('Jack')
jack.jump() // Jack-jump
var rose = new Person('Rose')
rose.jump() // Rose-jump

这里需要解释一下 this 和 new 的意义。细心的人会发现在写构造函数时函数名首字母用了大写，显得和普通函数不一样，有些神秘，其实构造函数和普通函数本质上并没有什么不同，用大写仅仅是为了同普通函数区分，表示这是一个要用来创建对象的函数。重点在关键词 new 上，简单来说，new 一个实例有以下步骤：

1. 创建一个新对象

2. 将构造函数作用域赋给新对象（即 this 指向新对象）

3. 执行函数里的代码

4. 返回函数

我们发现1、3、4就是 createPerson 函数所做的事，至于2涉及到作用域比较复杂，后面有时间再研究总结，现在只要知道 this 指向了 new 出来的新对象，因此我们给 this 增加的属性和方法都会绑定到新对象上去。

至此我们知道了如何利用构造函数（其实本质上是用 new 关键词）创建对象，它比一般函数直接创建要简洁很多。