1.将共享属性迁移到原型中去
当用某一个构造器创建对象时,其属性就会被添加到this中去。并且当被添加的属性实际上不会随着实体改变时,这种做法其实时效率低的。例如,Shape()构造器是这样定义的:
function Shape(){
this.name = 'Shape';
}
这种实现意味着我们用new Shape()创建的每个实体都会拥有一个全新的name属性,并在内存中拥有自己独立的存储空间。我们也可以选择name属性添加到原型上去,这样一来所有实体就可以共享这个属性了:
function Shape(){}
Shape.prototype.name = 'Shape';
这样,当我们再用new Shape() 新建对象时,name属性就不再是新对象的私有属性了,而是被添加进了该对象的原型中。虽然这样做通常会更有效率,但这也只是针对对象实体中的不可变属性而言的,对象的共有方法尤其适合这种共享形式。
现在,改造一下在1中的示例,将其所有的方法和符合条件的属性添加到原型对象中去:
//constructor
function Shape(){}
//augment prototype
Shape.prototype.name = 'Shape';
Shape.prototype.toString = function(){
return this.name;
}
//another constructor
function TwoShape(){}
//take care of inheritance
TwoDShape.prototype = new Shape();
TwoDShape.prototype.constructor = TwoDShape;
//augment prototype
TwoDShape.prototype.name = '2D shape';
通常会在对原型对象进行扩展之前,先完成相关的继承关系构建,否则TwoDShape.prototype中的后续新内容有可能会抹掉我们所继承来的东西。
而Triangle构造器的情况则不同,因为有new Triangle()所创建的各个对象所表示的三角形在尺寸上各不相同,因此,该对象的side和height属性必须保持自身所有,而其他属性则可以设置共享。例如,方法getArea()的计算方式并不会随着每个Triangle实例而改变。例外,必须在扩展原型对象之前完成继承关系的构建。
function Triangle(side, height){
this.side = side;
this.height = height;
}
//take care of inheritance
Triangle.prototype = new TwoDShape;
Triangle.prototype.constructor = Triangle;
//augment prototype
Triangle.prototype.name = 'Triangle';
Triagle.prototye.getArea = function(){
return this.side * this.height / 2;
};
测试一下:
> var my = new Triangle(5, 10);
> my.getArea();
> 25
>my.toString();
>Triangle
2.只继承于原型
由于原型中的所有代码都是可以重用的,这意味着继承自Shape.prtotype比继承自new Shape() 所创建的实体要好的多。毕竟,new Shape()方式会将Shape的属性设定为对象自身属性,这样的代码不可以重用,所以要将其设置在原型中,但我们可以采取如下方法对效率做一些改善:
- 不要单独为继承关系创建新对象
- 尽量减少运行时的方法搜索
function Shape(){}
// augment prototype
Shape.prototype.name = 'shape';
Shape.prototype.toString = function () {
return this.name;
};
function TwoDShape(){}
//take care of inheritance
TwoDShape.prototype =Shape.prototype;
TwoDShape.prototype.constructor = TwoDShape;
//augment prototype
TwoDShape.prototype.name = '2D shape';
function Triangle(side, height){
this.side = side;
this.height = height;
}
//take care of inheritance
Triangle.prototype = TwoDShape.prototype;
Triangle.prototype.constructor = Triangle;
//augment prototype
Triangle.prototype.name = 'Triangle'
Triangle.prototype.getArea = function () {
return this.side * this.height / 2;
}
var my = new Triangle(5, 10);
my.getArea();
25
my.toString();
Triangle
这样做,会令my.toString()有什么不同吗?
首先,js引擎同样会先查看my对象中有没有toString方法,自然,它是不会找到的,于是就会转而搜索该对象的原型属性。此时该原型预警指向了TwoDShape的原型,而后者指向的是Shape.prototype。
但是,这种方法的弊端就是,由于子对象和父对象指向的是同一个对象,所以一旦子对象对其原型进行了修改,父对象也就会随即被修改。
3.临时构造器 new F()
如果所有的prototype属都指向了一个相同的对象,父对象就会受到子对象属性的影响。要解决这个问题,就必须利用某种中介来打破这种连锁关系。可以考虑使用一个临时构造器来充当中介。即创建一个空函数F(),并将其原型设置为父级构造器。然后,我们既可以利用new F()来创建一个不包含父对象属性的对象,同时又可以从父对象prototype属性中继承一切。
function Shape(){}
// augment prototype
Shape.prototype.name = 'shape';
Shape.prototype.toString = function () {
return this.name;
};
function TwoDShape(){}
//take care of inheritance
var F = function(){};
F.prototype = Shape.prototype;
TwoDShape.prototype =new F();
TwoDShape.prototype.constructor = TwoDShape;
//augment prototype
TwoDShape.prototype.name = '2D shape';
function Triangle(side, height){
this.side = side;
this.height = height;
}
//take care of inheritance
var F = function() {};
F.prototype = TwoDShape.prototype;
Triangle.prototype = new F();
Triangle.prototype.constructor = Triangle;
//augment prototype
Triangle.prototype.name = 'Triangle'
Triangle.prototype.getArea = function () {
return this.side * this.height / 2;
}
var my = new Triangle(5, 10);
my.getArea();
25
my.toString();
Triangle
通过这种方法,我们就可以保持住原型链,并且父对象的属性不会被子对象所覆盖。