JS之创建对象

感谢讶羽大大的分享，想看原文移步讶羽大大的GitHub

1.工厂模式

function createPerson(name) {
    var o = new Object();
    o.name = name;
    o.getName = function () {
        console.log(this.name);
    };

    return o;
}

var person1 = createPerson('djp');

缺点：所有实例都指向一个原型

2.构造函数模式

function Person(name) {
    this.name = name;
    this.getName = function () {
        console.log(this.name);
    };
}

var person1 = new Person('kevin');

优点：实例可以识别成一个特定的类型

缺点：每次创建实例时，每个方法都要被创建一次，方法属性都在实例对象上。

2.1 构造函数模式优化

function Person(name) {
    this.name = name;
    this.getName = getName;
}

function getName() {
    console.log(this.name);
}

var person1 = new Person('kevin');

解决了每个方法都要被重新创建的问题，但是这样封装不太好

3.原型模式

function Person(name) {

}

Person.prototype.name = 'keivn';
Person.prototype.getName = function () {
    console.log(this.name);
};

var person1 = new Person();

方法不会重新创建了。

但是所有属性和方法都被共享了，不能初始化参数。

3.1 原型模式优化

function Person(name) {

}

Person.prototype = {
    name: 'kevin',
    getName: function () {
        console.log(this.name);
    }
};

var person1 = new Person();

这样封装比较好，但是你重写了原型，丢失了constructor属性

3.2 原型模式优化

function Person(name) {

}

Person.prototype = {
    constructor: Person,
    name: 'kevin',
    getName: function () {
        console.log(this.name);
    }
};

var person1 = new Person();

这样实例可以通过constructor属性找到构造函数，但是还是有其他问题。

4.组合模式

构造函数模式和原型模式合起来

function Person(name) {
    this.name = name;
}

Person.prototype = {
    constructor: Person,
    getName: function () {
        console.log(this.name);
    }
};

var person1 = new Person();

这样该共享的就共享，该私有的就私有。但是有些人就希望全部写在一起，更好的封装。

4.1 动态原型模式

function Person(name) {
    this.name = name;
    if (typeof this.getName != "function") {
        Person.prototype.getName = function () {
            console.log(this.name);
        }
    }
}

var person1 = new Person();

不能用字面量形式写原型

5.1 寄生构造函数模式

function Person(name) {

    var o = new Object();
    o.name = name;
    o.getName = function () {
        console.log(this.name);
    };

    return o;

}

var person1 = new Person('kevin');
console.log(person1 instanceof Person) // false
console.log(person1 instanceof Object)  // true

打着构造函数的幌子，因为创建的实例根本无法指向构造函数。

5.2 稳妥构造函数模式

function person(name){
    var o = new Object();
    o.sayName = function(){
        console.log(name);
    };
    return o;
}

var person1 = person('kevin');

person1.sayName(); // kevin

person1.name = "daisy";

person1.sayName(); // kevin

console.log(person1.name); // daisy