准备找工作了,所以把js再温习一遍,今天刚好看到了原型,所以就记录一下。PS:原文章位置:http://www.cnblogs.com/onepixel/p/5024903.html
如果基本了解了原型对象与原型链,可以直接跳到最后面,
简单来说,要了解原型,首先得知道两个概念:函数对象 Function与普通
对象 Object ,在网上看到一句话,觉得很有意思,在Javascript中,万物皆对象,js里的对象大致分为两种,就是上面提到的函数对象 与普通对象。
那么,怎么区分两种对象呢?举例说明:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
|
f1 f2 f3 就是函数对象,o1 o2 o3就是普通对象,
简而言之,通过 function 创建的就是函数对象,其他是普通对象。
在 JS 中,每当创建一个函数对象 f1 时,该对象中都会内置一些属性,其中包括 prototype 和 __proto__, prototype 即原型对象,
注意:prototype 对 f1 是不可见的,也就是说,f1 不会查找 prototype 中的属性和方法。
1 2 3 |
|
那么,prototype 有什么用呢? 其实 prototype 的主要作用就是继承。 通俗一点讲,prototype 中定义的属性和方法都是留给自己的 “后代” 用的,因此,子类完全可以访问prototype中的属性和方法。
于是乎,就有了原型链 __proto__ ,它存在于普通对象和函数对象中,它的作用就是引用父类的 prototype 对象,JS在通过 new 操作符创建一个对象的时候,通常会把父类的 prototype 赋值给新对象的 __proto__属性,这样就形成了一代代传承...
1 2 3 4 |
|
现在我们知道,obj中__proto__保存的是 f 的 prototype,那么 f 的 prototype 中的 __proto__ 中保存的是什么呢? 看下图:
如图所示,f.prototype 的 __proto__ 中保存的是 Object.prototype,Object.prototype 对象中也有 __proto__,而从输出结果看,Object.prototype.__proto__ 是 null,表示 obj 对象原型链的终结。如下图所示:
obj 对象拥有这样一个原型链以后,当 obj.foo 执行时,obj 会先查找自身是否有该属性,但不会查找自己的 prototype,当找不到foo时,obj 就沿着原型链依次去查找...
在上面的例子中,我们在f的 prototype 上定义了 foo 属性,这时 obj 就会在原型链上找到这个属性并执行。
总结一下以上涉及到的重点:
- 原型链的形成真正是靠__proto__ 而非prototype,当JS引擎执行对象的方法时,先查找对象本身是否存在该方法,如果不存在,会在原型链上查找,但不会查找自身的prototype。
- 一个对象的 __proto__ 记录着自己的原型链,决定了自身的数据类型,改变 __proto__ 就等于改变对象的数据类型。
- 函数的 prototype 不属于自身的原型链,它是创建子类的核心,决定了子类的数据类型,是连接子类原型链的桥梁。
- 在原型对象上定义方法和属性,是为了被子类继承和使用。
这里有一个图示来说明prototype是如何工作的。这个对象的每一个实例(boss1, boss2, boss3)都有一个内部属性叫做__proto__,这个属性指向了它的构造器(Employee)的属性prototype。当你执行 getSalary或者addSalary的时候,这个对象会在它的__proto__找到并执行这个代码。注意这点:这里并没有代码的复制(和 Example DT8的图表作一下对比)。
图中有几个难点:
1.Function构造函数可以用Function.__proto__来访问Function.prototype. 这是因为Function构造函数的构造函数是他本身,作为实例化对象的角色来访问,可行。
2.任何函数都是函数,他都继承Function的所有属性和方法,而Function是内置的构造函数,也是对象,都是继承Object的所有属性和方法。