理解js的prototype原型对象

我们创建的每一个函数都有一个prototype（原型）属性。这个属性是一个指针，指向一个对象，而这个对象的用途是包括能够由特定类型的全部实例共享的属性和方法。假设依照字面意思来理解，那么prototype就是通过调用构造函数而创建的那个对象实例的原型对象。使用原受对象的优点是能够让全部对象实例共享它所包括的属性和方法。换句话说，不必在构造函数中定义对象实例的信息，而是能够将这些信息直接加入到原型对象中，如以下的样例所看到的。

    function Person(){}
    Person.prototype.name = 'mychirs';
    Person.prototype.age = 29;
    Person.prototype.job = 'Software Engineer';
    Person.prototype.sayName = function(){
      alert(this.name);
    };

    var person1 = new Person();
    person1.sayName();//'mychirs'

    var person2 = new Person();
    person2.sayName();//'mychirs'

    alert(person1.sayName == person2.sayName);//true

在此。我们将sayName()方法和全部属性直接加入到了Person的prototype属性中，构造函数变成了空函数。即使如此，也仍然能够通过调用构造函数来创建新对象。并且新对象还会具有同样的属性和方法。但与构造函数模式不同的是，新对象的这些属性和方法是由全部实例共享的。换句话说．personl和person2訪问的都是同一组属性和同一个sayName()函数。要理解原型模式的T作原理，必须先理解ECMAScript巾原型对象的性质。

理解原型对象

不管什么时候，仅仅要创建了一个新函数，就会依据一组特定的规则为该函数创建一个prototype属性。这个属性指向函数的原型对象。在默认情况下，全部原型对象都会自己主动获得一个constructor（构造函数）属性，这个属性包括一个指向prot otype属性所在函数的指针。就拿前面的样例来说。Person.prototype. constructor措向Person。而通过这个构造函数。我们还可继续为原型对象加入其它属性和方法。

创建了自己定义的构造函数之后。其原型对象默认仅仅会取得constructor属性；至于其它方法，则都是从Obj ect继承而来的。当调用构造函数创建一个新实例后。该实例的内部将包括—个指针（内部属性），指向构造函数的原型对象。

ECMA-262第5版中管这个指针叫[[Prototype】]。

尽管在脚本中没有标准的方式訪问【[ Prototype]]，但Firefox、Safari和Chrome在每一个对象上都支持一个属性—proto_;而在其它实现中，这个属性对脚本则是全然不可见的。只是。要明白的真正重要的一点就是，这个连接存在于实例与构造函数的原型对象之间，而不是存在于实例与构造函数之间。

曾经面使用Person构造函数和Person.prototype创建实例的代码为例，图6-1展示了各个对象之间的关系。

上图展示rr Person构造函数、Person的原型属性以及Person现有的两个实例之间的关系。在此，Person *prototype指向了原型对象，而Person.prototype.constructor叉指回了Person。原型对象中除了包括cons t,ruct or属性之外，还包括后来加入的其它属性。Person的每一个实例personl和person2都包括一个内部属性。该属性只指向了Person.prot otype;换句话说，它们与构造函数没有直接的关系。此外。要格外注意的是。尽管这两个实例都不包括属性和方法，但我们却能够调用personl.sayName()。这是通过查找对象属性的过程来实现的。

尽管在全部实现中都无法訪问到[[Prototype]：，但能够通过isProcotypeOf()方法来确定对象之间是否存在这样的关系。从本质上讲。假设[[ Prototype]]指向调用isPrototypeOf()方法的对象[Person.prototype)．那么这种方法就返回true。例如以下所看到的：

alert(Person.prototype.isPrototypeOf(personl));	//true
alert(Person.prototype.isPrototypeOf(person2));	//true

这里，我们用原型对象的isPrototypeOf()方法測试了personl和person2 0由于它们内部都有一个指向Person.prototype的指针。因此都返回了true。

ECMAScript 5添加了一个新方法。叫Object.getPrototypeOf()，在全部支持的实现中，这种方法返回[[PrototypeJ]]的值。比如：

alert(Object.get PrototypeOf(personl) == Person.prototype);	//true
alert(Object.get PrototypeOf(personl).name );	//'Nicholas'

这里的第一行代码仅仅是确定Object.getPrototypeOf()返回的对象实际就是这个对象的原型。第二行代码取得了原型对象中name属性的值，也就是'Nicholas'。使用Object.getPrototypeOf()能够方便地取得一个对象的原型，而这在利用原型实现继承（本章稍后会讨论）的情况下是很重要的。

支持这种方法的浏览器有IE9+、Firefox 3.5+、Safari 5+、Opera 12+和Chrome。

每当代码读取某个对象的某个属性时，都会运行一次搜索，目标是具有给定名字的属性。搜索首先从对象实例本身開始。

假设在实例中找到了具有给定名字的属性，则返回该属性的值。假设没有找到。则继续搜索指针指向的原型对象，在原型对象中查找具有给定名字的属性。

假设在原型对象中找到了这个属性，则返回该属性的值。也就是说，在我们调用personl. sayName《）的时候，会先后运行两次搜索。

首先，解析器会同：“实例personl有sayName属性吗？”答：“没有。”然后，它继续搜索，再问：“personl的原捌有sayName属性吗？”答：“有。

”于是，它就读取那个保存在原型对象中的函数。当我们调用person2.sayName()时，将会重现同样的搜索过程，得到同样的结果。

而这正是多个对象实例共享原型所保存的属性和方法的基本原理。