《javascript高级程序设计》第六章 Object Creation VS Inheritance

时间:2023-03-09 03:09:13
《javascript高级程序设计》第六章 Object Creation VS Inheritance

6.1 理解对象
  6.1.1 属性类型
  6.1.2 定义多个属性
  6.1.3 读取属性的特性
6.2 创建对象
  6.2.1 工厂模式
  6.2.2 构造函数模式
  6.2.3 原型模式
  6.2.4 组合使用构造函数模式和原型模式
  6.2.5 动态原型模式
  6.2.6 寄生构造函数模式
  6.2.7 稳妥构造函数模式
6.3 继承
  6.3.1 原型链
  6.3.2 借用构造函数
  6.3.3 组合继承
  6.3.4 原型式继承
  6.3.5 寄生式继承
  6.3.6 寄生组合式继承


2017-09-15补充,看了面试题原型和原型链特点?

6.3.1 原型链

ECMAScript中描述了原型链的概念,并将原型链作为实现继承的主要方法。其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。.....

function Mother() {
this.a = true
}
Mother.prototype.getA = function() {
return this.a
} function Daug() {
this.b = false
}
//继承Mother
Daug.prototype = new Mother()
Daug.prototype.getB = function() { return this.b } var Helen = new Daug()
Helen.getA() //true
Helen.getB() //false

书上用的是SuperType SubType instance,我觉得我改的容易看出来

但是单独使用原型链继承有个不好的地方,包含引用类型值的原型属性会被实例共享:

function SuperType(){
this.colors = ["red", "blue", "green"];
}
function SubType(){
}
//继承了 SuperType
SubType.prototype = new SuperType(); var instance1 = new SubType();
instance1.colors.push("black");
alert(instance1.colors);
//"red,blue,green,black" var instance2 = new SubType();
alert(instance2.colors);
//"red,blue,green,black"

只贴两个比较经典的 object creation 和 inheritance (应该都属于原型和构造函数结合的方式)

(话说继承这个我还没有具体搞懂是什么意思,还要多看看中文)
object creation :
        function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["Shelby", "Court"];
} Person.prototype = {
constructor: Person,
sayName : function () {
alert(this.name);
}
}; var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor"); person1.friends.push("Van"); alert(person1.friends); //"Shelby,Court,Van"
alert(person2.friends); //"Shelby,Court"
alert(person1.friends === person2.friends); //false
alert(person1.sayName === person2.sayName); //true

继承 inheritance
constructor pattern for custom types: methods must be defined inside the constructor,so there's no function reuse.
构造函数模式存在的问题--方法都在构造函数中定义,因此函数复用就无从谈起了。

2017-09-15补充,终于看到原来也看到的地方,但是完全记不得了

所以最佳方式组合继承(combination inheritance)

6.3.3组合继承

...

其背后的思路是使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承。这样,既通过在原型上定义方法实现了函数的复用,又能够保证每个实例都有它自己的属性

 function SuperType(name){
this.name = name;
this.colors = ["red", "blue", "green"];
} SuperType.prototype.sayName = function(){
alert(this.name);
}; function SubType(name, age){
//inherit properties 继承属性
SuperType.call(this,name);
this.age = age;
} //inherit methods 继承方法
SubType.prototype = new SuperType(); SubType.prototype.constructor = SubType;
SubType.prototype.sayAge = function(){
alert(this.age);
}; var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors); //"red,blue,green,black"
instance1.sayName(); //"Nicholas";
instance1.sayAge(); // var instance2 = new SubType("Greg", 27);
alert(instance2.colors); //"red,blue,green"
instance2.sayName(); //"Greg";
instance2.sayAge(); //

---------------------------------------------------------------------------------------关于继承的补充20130423

SubType.prototype = new SuperType();  这句不要也可以实现继承,用call 或者 apply 即可

  var superType = function (name){
this.name = name;
this.color = ["red,yellow,blue"];
} superType.prototype.sayName = function (){alert(this.name)} var subType = function (name,age,color){
superType.apply(this,[name,color]);
this.age = age;
} subType.prototype.sayAge = function (){alert(this.age)}; var instance1 = new subType("vioya",30);
instance1.color.push("pink");
alert(instance1.name);
alert(instance1.color); var instance2 = new subType("maggie",24);
alert(instance2.name);
alert(instance2.color);