js原型

简介

JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型。由于 JavaScript 是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的。

  1. JavaScript 使用原型链的继承方式。
function Foo() {
    this.value = 42;
}
Foo.prototype = {
    method: function() {}
};
 
function Bar() {}
 
// 设置Bar的prototype属性为Foo的实例对象
Bar.prototype = new Foo();
Bar.prototype.foo = 'Hello World';
 
// 修正Bar.prototype.constructor为Bar本身
Bar.prototype.constructor = Bar;
 
var test = new Bar() // 创建Bar的一个新实例
 
// 原型链
test [Bar的实例]
    Bar.prototype [Foo的实例] 
        { foo: 'Hello World' }
        Foo.prototype
            {method: ...};
            Object.prototype
                {toString: ... /* etc. */};

注意: 1.简单的使用* Bar.prototype = Foo.prototype*将会导致两个对象共享相同的原型。 因此,改变任意一个对象的原型都会影响到另一个对象的原型,在大多数情况下这不是希望的结果。
2.不要使用 Bar.prototype = Foo,因为这不会执行 Foo 的原型,而是指向函数 Foo。 因此原型链将会回溯到 Function.prototype 而不是 Foo.prototype,因此 method 将不会在 Bar 的原型链上。

属性查找

当查找一个对象的属性时,JavaScript 会向上遍历原型链,直到找到给定名称的属性为止。到查找到达原型链的顶部 - 也是Object.prototype但是仍然没有找到指定的属性,就会返回undefined

性能

如果一个属性在原型链的上端,则对于查找时间将带来不利影响。特别的,试图获取一个不存在的属性将会遍历整个原型链。
并且,当使用** for in **循环遍历对象的属性时,原型链上的所有属性都将被访问。

总结

在写复杂的 JavaScript 应用之前,充分理解原型链继承的工作方式是每个 JavaScript 程序员必修的功课。 要提防原型链过长带来的性能问题,并知道如何通过缩短原型链来提高性能。 更进一步,绝对不要扩展内置类型的原型,除非是为了和新的 JavaScript 引擎兼容。

你可能感兴趣的:(js原型)