JS原型及原型链

一、JS对象

JS中的对象分为普通对象和函数对象，Object和Function是JS内置的函数对象，另外，通过new function得来的对象均为函数对象。如下图所示：

function f1(){};
var f2 = function(){};
var f3 = new Function('str','console.log(str)');

var o1 = {};
var o2 = new Object();
var o3 = new f1();

console.log(typeof Object);    //function
console.log(typeof Function);  //function
console.log(typeof f1);        //function
console.log(typeof f2);        //function
console.log(typeof f3);        //function
console.log(typeof o1);        //object
console.log(typeof o2);        //object
console.log(typeof o3);        //object

代码中，o1,o2,o3为普通对象，f1,f2,f3为函数对象。f1和f2归根结底都是通过new Function()的方式创建出来的。

二、原型对象

在JS中，对象被定义时，会自带一些预定义的属性。原型对象prototype就是函数对象中的其中一个预定义属性。

原型对象其实就是普通对象（Function.prototype除外，它是函数对象，但是这个函数对象没有prototype属性），如下所示。

 function f1(){};
 console.log(f1.prototype) // f1{}
 console.log(typeof f1. prototype) //object
 console.log(typeof Function.prototype) // function
 console.log(typeof Object.prototype) // object
 console.log(typeof Function.prototype.prototype) // undefined

从上述代码的输出结果可以看出：f1.prototype就是f1的一个实例对象，基本过程如下：

 var temp = new f1();
 f1. prototype = temp;

即：创建f1函数的同时，创建了一个f1的实例对象，并将它赋值给了它的prototype。由此可知为什么Function.prototype为什么是函数对象了，因为Function.prototype指向的是Function的一个实例对象new Function();上文提到过，凡是通过new Function方式创建的都是函数对象。

原型对象的作用：主要是用于继承，举个例子：

 var person = function(name){
    this.name = name;
 };
 person.prototype.getName=function(){
    return this.name;
 }
 var sherry = new person('sherry');
 sherry.getName();     //'sherry'

从上述代码可以看出，通过给person.prototype设置了一个函数对象属性，由person实例出来的普通对象（sherry）就继承了这个属性。继承的具体细节见下面的原型链部分。

三、原型链

JS在创建对象时，不论是普通对象还是函数对象，都有一个叫做proto 的内置属性，用于指向创建它的函数对象的原型对象，以上面的代码为例：

console.log(sherry.__proto__===person.prototype)//true
console.log(person.prototype.__proto__===Object.prototype)//true
console.log(Object.prototype.__proto__)//null

sherry的proto 的属性指向了创建sherry的函数对象（person）的prototype属性；同时person.prototype也是一个普通对象，也有自己的proto属性，它指向创建person.prototype的函数对象（Object）的prototype；同样，Object.prototype对象也有proto 属性，但它比较特殊，为null。
我们把这个由proto 串起来的直到Object.prototype.proto 为null的链叫做原型链。

四、constructor

原型对象prototype中有一个预定义的constructor属性，用来引用它的函数兑现过，只是一种循环引用：

  person.prototype.constructor === person      //true
  Function.prototype.constructor === Function  //true
  Object.prototype.constructor === Object      //true

五、总结

1. 原型链的形成真正是靠proto 而非prototype,当JS引擎执行对象的方法时，先查找对象本身是否存在该方法，如果不存在，会在原型链上查找，但不会查找自身的prototype。
2. 一个对象的proto记录着自己的原型链，决定了自身的数据类型，改变proto就等于改变对象的数据类型。
3. 函数的prototype不属于自身的原型链，它是子类创建的核心，决定了子类的数据类型，是连接子类原型链的桥梁。
4. 在原型对象上定义方法和属性的目的是为了被子类继承和使用。

---

原文地址： http://www.cnblogs.com/onepixel/p/5024903.html