JavaScript创建对象的七种方式(推荐)

JavaScript创建对象的方式有很多，通过Object构造函数或对象字面量的方式也可以创建单个对象，显然这两种方式会产生大量的重复代码，并不适合量产。接下来介绍七种非常经典的创建对象的方式，他们也各有优缺点。

工厂模式

function createPerson(name, job) {  var o = new Object()  o.name = name  o.job = job  o.sayName = function() {   console.log(this.name)  }  return o } var person1 = createPerson('Jiang', 'student') var person2 = createPerson('X', 'Doctor') 

可以无数次调用这个工厂函数，每次都会返回一个包含两个属性和一个方法的对象

工厂模式虽然解决了创建多个相似对象的问题，但是没有解决对象识别问题，即不能知道一个对象的类型

构造函数模式

function Person(name, job) {  this.name = name  this.job = job  this.sayName = function() {   console.log(this.name)  } } var person1 = new Person('Jiang', 'student') var person2 = new Person('X', 'Doctor') 

没有显示的创建对象，使用new来调用这个构造函数，使用new后会自动执行如下操作

创建一个新对象

这个新对象会被执行[[prototype]]链接

这个新对象会绑定到函数调用的this

返回这个对象

使用这个方式创建对象可以检测对象类型

person1 instanceof Object // true person1 instanceof Person //true 

但是使用构造函数创建对象，每个方法都要在每个实例上重新创建一次

原型模式

function Person() { } Person.prototype.name = 'Jiang' Person.prototype.job = 'student' Person.prototype.sayName = function() {  console.log(this.name) } var person1 = new Person() 

将信息直接添加到原型对象上。使用原型的好处是可以让所有的实例对象共享它所包含的属性和方法，不必在构造函数中定义对象实例信息。

原型是一个非常重要的概念，在一篇文章看懂proto和prototype的关系及区别中讲的非常详细

更简单的写法

function Person() { } Person.prototype = {  name: 'jiang',  job: 'student',  sayName: function() {   console.log(this.name)  } } var person1 = new Person()

将Person.prototype设置为等于一个以对象字面量形式创建的对象，但是会导致.constructor不在指向Person了。

使用这种方式，完全重写了默认的Person.prototype对象，因此 .constructor也不会存在这里

Person.prototype.constructor === Person // false 

如果需要这个属性的话，可以手动添加

function Person() { } Person.prototype = {  constructor：Person  name: 'jiang',  job: 'student',  sayName: function() {   console.log(this.name)  } } 

不过这种方式还是不够好，应为constructor属性默认是不可枚举的，这样直接设置，它将是可枚举的。所以可以时候，Object.defineProperty方法