欢迎光临
我们一直在努力

UCloud云社区__proto__与prototype的理解

这篇文章主要 解决的问题 是:什么是__proto__?什么是prototype?他们的关系是什么?在原型链中扮演什么角色?

proto和prototype

prototype是函数的一个属性,在定义构造函数的时候自动创建,它指向函数的原型,被 __proto__指向。这个原型对象里包含着自定义的方法属性。

__proto__是对象的内部属性,它指向构造器的prototype,对象依赖它来进行原型链的查询,instanceof方法也是依赖它来判断是否存在继承关系。

prototype只能作为构造函数的属性,而__proto__可以作为任意对象的属性。

proto、prototype和原型链之间的联系

看一段代码:

 function Foo(name) { this.name = name };
 Foo.prototype.age = 18;
 let student = new Foo("holy");

我们通过一张图来表示这段代码构建的原型链:

这张图中原型链可分成两部分:

student ---> Foo.prototype ---> Object.prototype ---> null
Foo ---> Function.prototype ---> Object.prototype ---> null

我们从 对象student 看起:根据 概念3 , prototype 只能作为构造函数的属性,__proto__只能作为对象的属性。所以对象sutdent 只有__proto__,没有prototype。

student.prototype;
undefined

student对象 是Foo构造函数的一个实例,根据 概念2 它的__proto__指向Foo.prototype

student.__ptoto__ == Foo.prototype;
true

以为 Foo.prototype 是一个对象,所以 Foo.prototype.__proto__指向 Object.prototype

Foo.prototype.__proto__ == Object.prototype;
true

再来看第二部分:
Foo 是一个函数,所以 Foo.__proto__指向 Function.prototype

Foo.__proto__ == Function.prototype
true

再 JavaScript 中函数都是第一公民,而且函数也是对象,所以Function.prototype.__proto__指向 Object.prototype

Function.prototype.__proto__ == Object.prototype
true

原型链的工作流程

student.name 在student中找到 name属性,返回“holy”;

student.age 在student中未找到,于是通过student.__proto__在Foo.prototype中找到,返回 18;

student.toString() 在student中未找到,接着通过student.__proto__在Foo.prototype中寻找,未找到,继续通过Foo.prototype.__proto__在Object.prototype中寻找,找到了,返回‘[object object]’。

student.getWeight() 依次在student、Foo.prototype、Object.prototype中寻找,均未找到,抛出错误。

赞(0)
未经允许不得转载:优乐评测网 » UCloud云社区__proto__与prototype的理解

优乐评测网 找服务器 更专业 更方便 更快捷!

支持快讯、专题、百度收录推送、人机验证、多级分类筛选器,适用于垂直站点、科技博客、个人站,扁平化设计、简洁白色、超多功能配置、会员中心、直达链接、文章图片弹窗、自动缩略图等...

联系我们联系我们

登录

找回密码

注册