JS创建对象的几种方式

192 阅读2分钟

之前看过JavaScript高级程序设计,但在最近的面试中被问到了其中的问题,没有回答好,特此做个总结;

  • new Object();
  • {}
  • Object.create();
  • 工厂模式
  • 构造函数模式
  • 原型模式
  • 构造函数和原型模式的组合
  • 动态原型模式

new Object()与{}等价

  1. 创建一个__proto__为Object的对象;

Object.create()

  1. 如果参数为null或没有,则创建了一个空对象,没有隐式原型,调用toString方法也会报错;
  2. 参数为原型对象,表示__proto__指向此原型;

工厂模式

function Person() {
  var o = new Object();
  o.name = 'hanmeimei';
  o.say = function() {
    alert(this.name);
  }
  return o;
}
var person1 = Person();

优点:创建了一个对象的请求

缺点:

  1. 无法通过constructor识别对象,以为都是来自Object,无法得知来自Person;
  2. 每次通过Person创建对象的时候,所有方法都是一样的,但是存储了多次,浪费计算机资源;

构造函数模式

function Person() {
  this.name = 'hanmeimei';
  this.say = function() {
    alert(this.name)
  }
}
var person1 = new Person();

优点:

  1. 通过constructor或者instanceof可以识别对象实例的类别
  2. 可以通过new关键字来创建对象实例,更符合面向对象语法;

缺点:

  1. 多个实例的方法仍然是一样的,但是创建多个对象的时候,存储了很多次,浪费了计算机资源的问题依然没有解决;

原型模式

function Person() {}
Person.prototype.name = 'hanmeimei';
Person.prototype.say = function() {
  alert(this.name);
}
Person.prototype.friends = ['lilei'];
var person1 = new Person();

优点:

  1. 方法实现了共享;
  2. 可以动态的添加原型对象的方法和属性

缺点:

  1. 对于引用类型,所有对象实例都指向同一个地址,其一对引用类型修改,其他实例也会改变;

构造函数和原型组合模式

function Person(name) {
  this.name = name
  this.friends = ['lilei']
}
Person.prototype.say = function() {
  console.log(this.name)
}
var person1 = new Person('hanmeimei')
person1.say() //hanmeimei

优点:

  1. 解决了原型模式对于引用类型的缺点;
  2. 解决了原型模式没有办法传递参数的缺点;
  3. 解决了构造函数模式不能共享方法的缺点;

缺点:欢迎补充;

动态原型模式

function Person(name) {
  this.name = name
  if(typeof this.say != 'function') {
    Person.prototype.say = function(
    alert(this.name)
  }
}

优点:

  1. 将共享方法封装到构造函数中;
  2. 可以在初次调用构造函数的时候就完成原型对象的修改;

缺点:欢迎补充;