原型
每个 JavaScript 对象都有一个与之相关联的另一个 JavaScript 对象(或null,但这是罕见的)。 第二个对象被称为原型,第一个对象从原型继承属性。
换句话说:每个 JS 对象一定有一个对应的原型对象,并从原型对象继承属性和方法。
默认时,原型对象是空对象。
默认情况下,每一个原型对象都有一个 constructor 属性,这个属性指向 prototype 所属的方法。默认时,原型对象通过 constructor 指向函数,函数通过 prototype 指向原型对象。
函数的原型
每一个函数都是 Function 的实例。所以下面两个输出都返回的是 true。
```javascript
alert(Object.__proto__ == Function.prototype)
function Demo(){}
alert(Demo.__proto__ == Function.prototype)
```
Object 是系统内置的一个方法 ,所以它的 __proto__ 就是 Function.prototype。在这个时候,它与自己定义的 Demo 方法是一样的。
prototype
创建函数时,JS 会自动为这个函数添加 prototype 属性,值是空对象。用于存储该函数实例化出的对象所共享的属性与方法。这个对象就是原型对象,简称原型。
prototype 是函数的属性,对象中没有该属性
-
任何对象都会从其原型对象中继承方法与属性。因此,当调用到对象中不存在的某个方法或属性时,会延着其原型一级级的往上查找,直到找到或到达原型链的顶层。
function Demo () { } Demo.prototype.name = function(){ alert('prototype function') } var d = new Demo() var d2 = new Demo() alert(d.name == d2.name) // true d.name() d2.name() alert(d.hasOwnProperty('name')) // false alert(d2.hasOwnProperty('name')) // false d.name = function(){ alert('d.name') } d.name() d2.name()
初始时,d 与 d2 中都没有 name 方法,调用时两者都会找到原型对象中的 name 方法,所以两者相等,且输出的结果一样,都是 prototype function。
对 d 的 name 方法进行重新定义,使 d 中有一个 name 方法(但这并不影响 d2 中没有 name 方法),所以再次输出时,d 输出的是 d.name,而 d2 输出的依旧是 prototype function。
原型也可以当作一个普通的对象,它与普通对象的区别在于:原型中的属性与方法是别的实例所共有的。
如果函数只是当作普通函数,其原型对象没有什么用。
-
使用原型可以扩展类的功能。
String.prototype.ex = function(){ alert('this is ex'); } 'str'.ex() // 本身 String 没有 ex 功能,但通过原型扩展了 String 的功能
自定义原型对象
可以手动的为 prototype 指定一个对象。如下:
function Demo () {
}
var cp = {
age:'fdafdasfasdf'
};
Demo.prototype= cp; // 将 cp 对象指定成 Demo 的原型对象
var d = new Demo()
alert(d.age) // Demo 的实例 d 具有原型对象中所定义的一切属性与方法
alert(Demo.prototype.constructor == Demo) //false
alert(Demo.prototype.constructor == Object) //true
指定原型对象后,原型对象的 constructor 属性便不会指向构造函数。
为达到默认情况下 constructor 依旧指向原来的构造函数,可以手动为原型对象添加上 constructor 属性,使其指向构造函数。即将 cp 的初始化改为如下形式:
var cp = {
age:'fdafdasfasdf',
constructor:Demo // 手动指定 constructor 指向 Demo
};
__proto__
-
每一个函数都有一个 prototype 属性,用于指向原型。而一旦你把这个函数当作构造函数调用,那么 JS 就会帮你创建该构造函数的实例,实例继承构造函数 prototype 的所有属性和方法(实例通过设置自己的 __proto__ 指向承构造函数的 prototype 来实现这种继承)。因此,对象的 __proto__ 指向自己构造函数的 prototype。
function Demo(){ } var p = {} Demo.prototype = p; var d = new Demo() document.write(Demo.prototype == d.__proto__) // true document.write(Demo.prototype == p) // true
-
原型链的最顶层对象是 Object.prototype,也就是 Object 的原型对象。并且该对象的 __proto__ 属性值为 null。也就是说 Object 的原型对象没有原型。
alert(Object.prototype.__proto__) // null
比较
- prototype 是函数的一个属性, 它指向函数的原型.
- __proto__ 是对象的内部属性, 它指向构造函数的原型, 对象依赖它进行原型链查询.
- prototype 只有函数才有, 其他(非函数)对象不具有该属性. 而 __proto__ 是对象的内部属性, 任何对象都拥有该属性。所以每一个函数也都具有 __proto__ 属性——因为函数也是对象。