js原型

2019-08-14  本文已影响0人  Super曲江龙Kimi

对象

首先明确一点,对象都是通过函数创建的。let obj = {a:1} 只是一种快捷方式

原型 prototype

原型.png

每个函数都有一个prototype属性指向他的原型,这个prototype的属性值是一个对象,默认的只有一个叫做constructor的属性,指向这个函数本身。

function Foo () {}
let a = new Foo();
a.constructor // 指向Foo,但是constructor属性是从prototype上继承来的。
function Foo () {}
Foo.prototype = {} // 创建一个新原型对象
let a = new Foo();
a.constructor === Foo // false
a.constructor === Object // true  本身原型上没有了constructor 属性,则会沿着原型链查找到Object 

因为每个对象都有一个隐藏的属性“__proto__,这个属性引用了创建这个对象的函数的prototype。即:fn.__proto__ === Fn.prototype。所以可以使用原型的方法

原型.png

总结: 每个函数function都有一个prototype原型。每个对象都有一个__proto__隐式原型。

对象和函数关系

对象都是函数创建出来的,那么函数是谁创建的呢。---Function

原型链.png

再回顾下之前的总结

每个函数function都有一个prototype原型。每个对象都有一个__proto__隐式原型。

对于function Foo来说。他是函数。所以他就有一个prototype指向Foo.prototype,他也可以是对象(函数也是一种对象)。那么他也有一个__proto__指向创建他的函数的原型 Function.prototype

所以我们来看Object和Function的关系,就有种鸡生蛋、蛋生鸡的感觉


完整.png

function Function当做函数时有prototype指向Function.prototype。当对象时有一个__proto__指向创建他的函数的原型 ,那么谁创建的函数呢 答案肯定还是Function自己。感觉是自己创建了自己。而Function.prototype是一个对象。所以他有__proto__指向创建他的函数的原型。对象是function Object创建的
所以Function.prototype.__proto__ === Object.prototype

function Object当做函数时有prototype指向Object.prototype。当对象时有一个__proto__指向创建他的函数的原型,函数肯定是Function创建的。那么就有Object.__proto__ === Function.prototype。而Object.prototype对象的__proto__指向null。让原型链形成结束。

正是因为这样,Object、Function之间形成了一个闭环

Instanceof

Instanceof的判断是:沿着A的__proto__这条线来找,同时沿着B的prototype这条线来找,如果两条线能找到同一个引用,即同一个对象,那么就返回true。如果找到终点还未重合,则返回false。
所以以下判断都成立

Object instanceof Function // true
Function instanceof Object // true
// Function 当作对象__proto__指向创建它的Function的原型Function.prototype。
// 而Function.prototype是个对象,他的__proto__指向Object.prototype。判断为true
Function instanceof Function // true

instanceof表示的就是一种继承关系,或者原型链的结构
javascript中的继承是通过原型链来体现的。原型继承
访问一个对象的属性时,先在基本属性中查找,如果没有,再沿着__proto__这条链向上找,这就是原型链。

上一篇 下一篇

猜你喜欢

热点阅读