我来从新学习 javascript 的面向对象(part 3)

续上一集内容,有一些数据不须要共享的时候,可是又想实现共享数据处理,鱼与熊掌,都要兼得(老板就是这么霸气),那么通过工程师们的智慧交流,他们发现现实并不是那么残酷,还有一些办法可取的,也就是组合使用构造函数模式和原型模式动态原型模式javascript

1、组合使用构造函数模式和原型模式

组合使用构造函数模式和原型模式的特色主要体如今:java

  • 构造函数模式用于定义实例属性
  • 原型模式用于定义方法和共享属性

效果就是,每一个实例对象都会有本身的一份实例属性,但又同时又共享着对方法的引用,既节省了资源也知足了业务要求。数组

// 构造函数用于定义实例属性
function Food(name) {
  this.name = name;
  this.place = ["巴西", "印度"];
}
// 原型模式用于定义方法和共享属性
Food.prototype = {
  constructor: Food,
  sayName: function() {
    console.log("我是" + this.name);
  }
};

var food1 = new Food("苹果");
var food2 = new Food("苹果");
console.log(food1.place == food2.place); // 返回 false
food2.place.push("俄罗斯");
console.log(food1.place); // 返回 [ '巴西', '印度' ]
console.log(food2.place); // 返回 [ '巴西', '印度', '俄罗斯' ]

能够看到 palce 数组并非同一个,而且经过对 food2的 place 数组赋值以后也不会影响 food1的 palce 数组的值,证实他们是互相独立的。安全

之因此有这么屌炸天的效果,就是由于利用了构造函数和原型模式各自的特色,互相补充。

2、动态原型模式

动态原型模式的特色是,在构造函数里面增长判断处理是否添加原型对象属性。函数

function Food(name, place) {
  this.name = name;
  this.place = place;
  if (typeof this.sayName !== "function") {
    Food.prototype.sayName = function() {
      console.log("我是" + this.name);
    };
  }
}

var food1 = new Food("苹果", ["巴西", "印度"]);
food1.sayName(); // 返回 我是苹果
  • 经过在构造函数执行的时候来判断是否将共享的东西添加到原型对象里面,这样就不怕以前出现的先 new 实例化对象,而后再添加原型对象的属性的问题了(回想一下原型对象被重写以后,原型对象丢失,实例没法使用原来的原型对象的数据的问题)。
  • 更符合 OOP 开发习惯,不须要将构造函数和原型对象分开单独处理,能够写在一块儿。
动态原型模式和组合使用构造函数模式和原型模式的原理其实很相似,都是各自利用了构造函数和原型模式的独特的特色来实现的,不过在实现的过程当中用了一些取巧,因此致使了他们的分别,细细回想一下就明白了。

3、寄生构造函数模式

这个只是了解一下便可,由于实际中用得很少,可是须要扩大知识面,不管从装逼仍是装逼都仍是须要的。

寄生这个词其实不太好理解,英文原文是叫 parasitic 直接翻译过来就是寄生了。若是硬要理解,就是建立的实例对象实际上是依附上去的,跟构造函数和原型对象自己并无任何关系,就好像寄生虫和动物,他们仅仅只是寄生在上面而已。网站

function Food(name) {
  var o = new Object(); 
  o.name = name;
  o.sayName = function() {
    console.log("我是" + this.name);
  };
  return o; // 重写返回值
}

var food1 = new Food("苹果");
console.log(food1.name); // 返回 苹果
food1.sayName(); // 返回 我是苹果
  • 这里跟工厂模式极其类似,但这里使用了 new 进行实例化,换言之,也就是执行了构造函数来进行实例化。
  • 构造函数在不返回值的状况下,默认会返回新对象实例,而经过构造函数的末尾添加一个 return 语句,能够重写这个返回值。
  • 由于每次都是new Object(); ,并且构造函数的返回值被重写了,也就是说这个返回的新对象跟构造函数,跟原型对象是没有关系的,他们同时具备工厂函数和构造函数的缺点。
  • 这里可以访问 name,由于这里的 name 属性是暴露到返回的对象上面了,成为返回的对象的属性,就跟 sayName 方法同样,能够被外部访问了。
他有一个严重的问题,就是原型对象和实例和构造函数之间没办法关联,这样不适合在有必定规模复杂度的程序开发中使用。(由于他每次都会new Object(),重置原型对象的信息)

4、稳妥构造函数模式

这个只是了解一下便可,由于实际中我还没用过,可是须要扩大知识面,不管从装逼仍是装逼都仍是须要的。

所谓稳妥对象,是指没有公共属性,并且其方法也不引用 this 对象,并且也不能被篡改,稳得一逼。this

function Food(name) {
  var o = new Object();
  var color = 'red';
  o.sayName = function() {
    console.log("我是" + name);
    console.log("颜色是" + color);
  };
  return o;
}

var food1 = Food("苹果");
console.log(food1.name); // 返回 undefined
console.log(food1.color); // 返回 undefined
food1.sayName(); // 返回 我是苹果,颜色是red
  • 能够看到这里不使用this,也不使用 new 来实例化对象。
  • 不能经过其余方式访问 name 属性,由于没有name 属性没有被暴露出来。
  • 只能经过暴露出来的方法来访问对象内部的属性,间接保护了内部私有属性。
稳妥模式适合在一些安全环境(禁止使用 this,而且也须要保护私有属性)里面使用。
他依然有一个严重的问题,就是原型对象和实例和构造函数之间没办法关联,这样不适合在有必定规模复杂度的程序开发中使用。(由于他每次都会new Object(),重置原型对象的信息)

5、文末咱们又遇到新问题了

公司业务愈来愈大了,公司的产品须要作一些分类,例如动物要分肉食动物,菜食动物,食物要分水果和蔬菜和肉类等,水果下面还要分苹果,香蕉等等,要是按照如今的模式,看来是要有多少种就要写多少种,而后还可能会致使一些种类属性重复,老司机一眼就看出来,须要作一些种类继承了,可是要怎么作呢?spa

参考内容

  1. 红宝书,javascript 高级程序设计第三版
  2. 浅谈稳妥构造函数模式的实现原理与机制

版权信息

做者: 怂如鼠
网站: https://www.whynotbetter.com 本做品著做权归做者全部,商业转载请联系做者得到受权,非商业转载请注明出处。
相关文章
相关标签/搜索