重庆铜梁网站建设费用,系统开发需求怎么写,许昌建网站,平阳手机网站制作一#xff0e; 前言
原型和原型链在面试中历来备受重视#xff0c;经常被提及。说难可能也不太难#xff0c;但要真正完全理解#xff0c;吃透它#xff0c;还是要多下功夫的。
下面为大家简单阐述我对原型和原型链的理解#xff0c;若是觉得有说的不对的地方#xff…一 前言
原型和原型链在面试中历来备受重视经常被提及。说难可能也不太难但要真正完全理解吃透它还是要多下功夫的。
下面为大家简单阐述我对原型和原型链的理解若是觉得有说的不对的地方还请帮忙指正或者关闭页面不浪费您的宝贵时间(害怕)
二 正文
原型
1. JavaScript所有的对象本质上都是通过new 函数创建的包括对象字面量的形式定义对象(相当于new Object()的语法糖)。
2. 所有的函数本质上都是通过new Function创建的包括Object、Array等 隐式执行是我们看不到的但在执行过程中发生过的
3. 所有的函数都是对象。
剖析
Prototype显式原型 每个函数都有一个属性prototype它就是原型默认情况下它是一个普通Object对象这个对象是调用该构造函数所创建的实例的原型。
__proto__(谷歌浏览器已更新为[[prototype]]隐式原型)
JavaScript中所有对象(除了null)都具有一个__proto__属性该属性指向该对象的原型。
上图中函数身上的属性会被显式的继承到即 //this.name’wn’, 此时显式的不存在所以继承不到但是函数的原型上有属性就会被隐式的继承到即 [[Prototype]]: Object name: “小南” contructor属性 JavaScript同样存在由原型指向构造函数的属性constructor即Func.prototype.constructor -- Func
原型链
实例对象在查找属性时如果查找不到就会沿着__proto__去与对象关联的原型上查找如果还查找不到就去找原型的原型直至查到最顶层这也就是原型链的概念。 参考 前端进阶面试题详细解答
通过这张图我们可以注意到,构造函数Foo的原型prototype 和 构造函数Foo所创建出来的对象实例f1,f2的原型__proto__是一样的都指向Foo().prototype.
这里我们可以继续思考,往下探索一下,既然Foo().prototype也是一个对象,那是不是Foo().prototype也有自己的对象原型__proto__呢.答案是肯定的,图中我们也可以看到Foo().prototype的对象原型__proto__指向的是Object.prototype. Object作为最顶端的构造函数,可以看到所有的对象都会通过原型链指向它.这就是为什么新建的对象为什么能够使用 toString() 等方法的原因.
但是我们可以发现Object.prototype也有自己的__proto__ 但是却指向的是null,null为原型链的终点.
注意!!!
那么这里还个问题,细心的小伙伴已经发现了,构造函数有自己的原型prototype,但是构造函数也是对象啊,构造函数也有没有__proto__呢.答案是有的.因为每个 JavaScript 函数实际上都是一个 Function 对象。运行 function(){}).constructor Function // true 便可以得到这个结论。
而且通过图我们也可以发现 Foo的__proto__指向Function.prototype,而且这里还有个特例,上文也说明了每个 JavaScript 函数实际上都是一个 Function 对象,所以Function的构造函数原型prototype和对象原型__proto__都是指向同一个Function.prototype.
结语
原型和原型链算是js里的一座大山比较偏概念性在面试时是经常出现的所以闲时可以多拿出来琢磨。 鄙人写的也略有浅显希望能帮到查阅的小伙伴呀。 码字不易还望看到这里的小伙伴用用发财的小手点点赞与君共勉
