JavaScript创建对象

JavaScript中创建对象有以下七种方式：

• 工厂模式
• 构造函数模式
• 原型模式
• 构造函数和原型组合模式
• 动态原型模式
• 寄生构造函数模式
• 稳妥函数构造模式

工厂模型

• 示例

function createPerson(name,age,job){
  var person=new Object();
  person.name=name;
  person.age=age;
  person.job=job;
  person.sayName=function(){
    alert(this.name);
  }
  
  return person;
}
var person1=createPerson("Lucy",18,"student");
person1.sayName();  //Lucy
var person2=createPerson("Bob",30,"teacher");
person2.sayName();    //Bob

• 优点：
  可以创建多个相似对象
• 缺点：
  无法确定该对象的类型

---

构造函数模式

• 示例：

function Person(name,age,job){
    this.name=name;
    this.age=age;
    this.job=job;
    this.sayName=function(){
       alert(this.name);
    }
 }
var person1=new Person("Lucy",18,"student");
person1.sayName();  //Lucy
var person2=new Person("Bob",30,"teacher");
person2.sayName();    //Bob

• 优点：
  • 可以将对象的实例标识为一种特定的类型，可以通过instanceof检测对象实例类型
  • 必须使用new操作符
• 缺点：
  不同实例上的同名函数是不相等的，导致具有相同功能的方法在不同的实例上创建多次
• 注意：
  • 如果不用new来调用构造函数，this对象就会指向Global对象（在浏览器中就是window对象）
  • 构造函数在不返回值的情况下，默认会返回新对象实例

---

原型模式

• 示例

function Person(){

 }
Person.prototype.name="Lucy";
Person.prototype.age=18;
Person.prototype.job="student";
Person.prototype.sayName=function(){
       alert(this.name);
} 
var person1=new Person();
person1.sayName();   //Lucy
//Person.prototype.sayName();    Lucy 

• 优点：

  • 可以让该对象的所有实例共享它所包含的属性和方法
  • 可以动态添加原型对象的方法和属性

• 缺点：
  当更改的对象实例的属性值为引用类型时，会出现问题。

function Person(){
 }
Person.prototype.name="Lucy";
Person.prototype.age=18;
Person.prototype.job="student";
Person.prototype.sayName=function(){
  alert(this.name);
}
Person.prototype.friend=["Linda"];
var person1=new Person();
var person2=new Person();
person1.friend.push("Jack");
console.log(person1.friend);   //["Linda", "Jack"]
console.log(person2.friend);   //["Linda", "Jack"]

原型中的所有属性是被很多实例共享的，尤其friend的属性值是引用类型，person1.friend与person2.friend指向同一个数组，因此修改person1.friend后，person1.friend与person2.friend的值相等

• 注意：
  使用对象字面量重写原型时，会切断现有原型与任何之前已经存在的对象实例时间的联系。示例如下：

function Person(){
}
var person=new Person();
Person.prototype={
     constructor:Person,
     name:"Lucy",
     age:18,
  job:"student",
  sayName:function(){
    alert(this.name);
  }
};
person.sayName();   //error

---

构造函数和原型模式

• 示例

function Person(name,age,job){
     this.name=name;
     this.age=age;
     this.job=job;
     this.friends=["Jack"];
}
Person.prototype.sayName=function(){
       alert(this.name);
}
var person1=new Person("Lucy",18,"student");
var person2=new Person("Bob",30,"teacher");
person1.friends.push("Linda");
console.log(person1.friends); //["Jack", "Linda"]
console.log(person2.friends);   //["Jack"]

• 优点：
  • 解决了原型模式对于引用对象的缺点
  • 解决了原型模式没有办法传递参数的缺点
  • 解决了构造函数模式不能共享方法的缺点

这是使用最广泛，认同度最高的一种创建自定义类型的方法

---

动态原型模式

• 示例：

function Person(name,age,job){
    this.name=name;
    this.age=age;
    this.job=job;
    if(typeof this.sayName != "function"){
      Person.prototype.sayName=function(){
        alert(this.name);
      }
    }
  }
var person=new Person("Lucy",18,"student");
person.sayName();

• 优点：
  • 只会在除此调用构造函数时执行，完成原型的初始化
  • 对原型的修改，会立即在所有实例中得到反映
  • 可以使用instanceof操作符来确定实例的类型
• 注意：
  使用动态原型模式时，不能用对象字面量重写原型

---

寄生构造函数模式

• 示例：

function Person(name,age,job){
    var person=new Object();
    person.name=name;
    person.age=age;
    person.job=job;
    person.sayName=function(){
      alert(this.name);
  }
    return person;
}
var person=new Person("Lucy",18,"student");
person.sayName();

• 优点：
  可以重写调用构造函数时返回的值
• 缺点：
  • 返回的对象与构造函数之间没有关系
  • 不能依赖instanceof操作符来确定对象类型
• 注意：
  尽量避免使用这种模式

---

稳妥构造函数模式

• 示例：

function Person(name,age,job){
    var person=new Object();
  // 可以在这里定义私有变量和函数
    person.sayName=function(){
      alert(name);
    }
      return person;
}
var person=Person("Lucy",18,"student");
person.sayName();

• 优点：
  安全性比较高
• 缺点：
  不能通过instanceof操作符确定实例类型

参考文章：
JavaScript 创建对象的 7 种方法