JS 原型（prototype）详解

JS的原型是什么？

首先来看一段代码：

function C() {
console.log("C is a class");
}
function f() {
console.log("f is a function");
}

在js中"function" 关键字有两个含义，既可以把它当作一个普通函数关键字，也可以把它当作类的构造函数（即定义类）关键字。

上面定义的两个函数，不管你是想定义一个类的构造函数还是就定义一个普通函数。它们都包含一个prototype和constructor属性。

prototype属性指向了一个对象，这个对象即是原型对象。这就是JS中的原型概念。很简单把？

constructor属性指向该函数的构造函数。函数的构造函数？在这里有必要把函数的构造函数讲一下。既然每个函数都包含prototype和constructor,其实就可以把函数"C", "f"当作一个对象，其实浏览器也就这么干的。当我们打印出来typeof C 的类型时会显示是fucntion, 懂点js对象就会有疑问。既然是对象，那么为什么打印出来的不是object。其实可以这样理解，js中对象有两个概念，一个是function类型对象，一个object类型的对象。

下面来看一下自定义函数的构造函数是什么：

console.log(C.constructor);

上面执行的结果是：function Function() { [native code] }
从这个小实验可以得出一个结论：所有通过function关键字定义的函数对象都是Fucntion这个函数构造出来的。

上面大多是在讲函数，函数的构造函数，函数对象的概念。

原型对象是用来做什么的，有什么功能？

1、所有从某个函数构造的对象都共享该函数原型对象。

2、原型对象的原型对象....构成了一个原型链，任何一个对象可以共享原型链中的所有方法和属性。

3、通过原型对象可以实现继承。

原型对象的特点分析：

1、每个函数都有一个prototype属性，指向该函数的原型对象。原型对象默认是一个“{}” 空对象。

2、每个对象都有一个__proto__属性，指向构造它的函数的原型对象。它和它的构造函数的prototype属性指向的是同一个对象，即C.prototype == new C().__proto__

3、所有对象都有一个__proto__属性，它们都指向构造它的函数的原型对象。只有Object的原型对象为null。

4、每个原型对象都一个constructor和__proto__属性。C == C.prototype.constructor == new C().__proto__.constructor。__proto__属性指向了该原型对象的构造函数的原型对象（即原型对象的原型对象），通过这个属性就构成了一个原型链。

5、原型对象的原型对象的原型对象....构成了一个原型链，每个自定义函数的原型对象的__proto__属性指向Object的原型对象，Object的原型对象为null。

6、通过原型链就实现了继承。当调用一个对象的方法或属性时它首先会在本对象找，然后在原型对象找，再往原型对象的原型对象找，直到最后一个null，这也就是为什么，每个自定义的对象都可以调用Object对象的方法，它的内部机制就是原型链。

3、每个函数的原型对象的类型都是object类型，除了自定义函数的构造函数(C.constructor)。

4、每个对象都有一个constructor属性，指向它的构造函数。C == new C().constructor

原型对象运用的小例子：

1.同一个构造函数创建的对象共享同一个原型对象。

function C() {

}

C.prototype.name = 'zz';
C.prototype.f = function() {
console.log("f");
}
var c1 = new C();
var c2 = new C();
console.log(c1.name + "==" + c2.name);
c1.f();
c2.f();

2、通过原型对象实现继承

function F() {
<span style="white-space:pre">	</span>this.name = "name";
}
F.prototype.ff = function(){
<span style="white-space:pre">	</span>console.log("ff");
}
function C() {

}
C.prototype = new F(); //继承F对象的属性和方法
var c1 = new C();
console.log(c1.name);
c1.ff();

3、共享原型链中的方法和属性

function C() {

}
Object.prototype.f = function() {
console.log("object f");
};
Object.prototype.name = 'Object';
var c1 = new C();

c1.f();
console.log(c1.name);