js原型链的说明
首先需要明确的是:只有对象有__proto__属性,而函数只有prototype属性,没有__proto__属性,函数的原型有一个constructor属性,指向的是函数本身!
Function是Object的构造函数,而Object又是function的构造函数,也就是Object是Function.prototype原型的构造函数。
对于上面的javascript图的原型链而言,一切说明如下代码所演示的一样:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <title></title> <script src="jquery-1.9.1.min.js"></script> </head> <body> <script type="text/javascript"> function Person(name,age){ this.name = name; this.age = age; } var a =new Person("zhagns",2); //无论是内置函数Object、Function还是自定义的函数本身都是一个对象,只要是对象就有__proto__原型对象, //这个原型对象指向的都是Function.prototype console.log(Person.__proto__===Function.prototype); //对于Function函数来说又是特殊的,因为它是一个函数,所以它本身是一个对象,也就是它的__proto__属性一定是指 //向Function.prototype;所以Function自身的__proto__指向的是 //自身的prototype,这和其它的内置函数或者自定义函数又是不同的 console.log(Function.__proto__ === Function.prototype); //无论是自定义的函数还是内置的Function函数,他们的原型又是一个对象,是对象就有__proto__属性,也就是他们的原 //型对象是Object.prototype,而Object.prototype也是一个Object类型的对象,它的__proto__原型对象是null。 console.log(Person.prototype.__proto__=== Object.prototype); //对象的类型是Object, console.log(typeof a) console.log(a instanceof Object); console.log(a instanceof Function) console.log(Object.prototype); console.log(typeof Object.prototype); console.log(Object.prototype.__proto__); //对与Function的prototype而言有点特殊,它不是一个Object类型的对象,而是一个function类型的对象,而且其原型对象是Object.prototype。 console.log(Function.prototype); console.log(typeof Function.prototype) console.log(Function.prototype.__proto__); console.log(typeof Function.prototype.__proto__); console.log(Object.prototype === Function.prototype.__proto__); console.log(Object.prototype.__proto__); //对象的类型是Object,而任何函数都是function类型的;也就是任何函数[自定义函数还是内置的Object、Function函数]都是function类型的! console.log(typeof Person) console.log(typeof Object) console.log(typeof Function) //任何函数都是Function的实例,同时任何函数也都是Object的实例! console.log(Function instanceof Object) console.log(Object instanceof Function) //综上:Function有2点特殊的地方: //1.它的__proto__原型对象指向的是自身的prototype属性。 //2.它的prototype不是Object类型的对象,而是一个function类型的对象,而且这个对象的原型对象是Object.prototype。 </script> </body> </html>
输出结果如下所示:
[Web浏览器] "true" /FirstProject/index1.html (17) [Web浏览器] "true" /FirstProject/index1.html (21) [Web浏览器] "true" /FirstProject/index1.html (24) [Web浏览器] "object" /FirstProject/index1.html (26) [Web浏览器] "true" /FirstProject/index1.html (27) [Web浏览器] "false" /FirstProject/index1.html (28) [Web浏览器] "[object Object]" /FirstProject/index1.html (29) [Web浏览器] "object" /FirstProject/index1.html (30) [Web浏览器] "null" /FirstProject/index1.html (31) [Web浏览器] "function Empty() {}" /FirstProject/index1.html (33) [Web浏览器] "function" /FirstProject/index1.html (34) [Web浏览器] "[object Object]" /FirstProject/index1.html (35) [Web浏览器] "object" /FirstProject/index1.html (36) [Web浏览器] "true" /FirstProject/index1.html (37) [Web浏览器] "null" /FirstProject/index1.html (38) [Web浏览器] "function" /FirstProject/index1.html (40) [Web浏览器] "function" /FirstProject/index1.html (41) [Web浏览器] "function" /FirstProject/index1.html (42) [Web浏览器] "true" /FirstProject/index1.html (44) [Web浏览器] "true" /FirstProject/index1.html (45)