如何理解_proto_和prototype

原型空间

我们知道在js中万物皆对象,现在我们假设每一个对象创建时都会产生一个原型空间(原型对象 )

现在我们记住三句话

实例由其定义共享原型空间 由proto来寻找定义的原型空间 由prototype来寻找自己的原型空间

实例由其定义共享原型空间

ps

p:prototype
[p]: _proto_
此图片为转载

此图片为转载


从上面两张图可以清楚看出这种关系这样就可以形成原型链

所有函数都是由Function构造函数构造的 function函数也是Function构造函数构造的所以时function自己构造了自己所以自己指向自己的原型空间 我们可以看出图中function的原型空间和animal的原型空间都是object类型(其实第二列的原型空间都是object的实例,但逻辑上不是)

//所有函数类型的隐式原型都相同 因为都是Function的原型对象创建
//所以构造函数的__proto__是Function
//那么Function的隐式原型 ?
var fun = new Function();
console.log(fun.__proto__===Function.prototype);
console.log(Function.__proto__===Function.prototype);
//所以Function本身的隐式原型和显示原型相同
//可以看出Object也是函数定义的所以他的隐士原型应该是Function 的显示原型
console.log(Object.__proto__===Function.prototype)

那么object的原型空间的原型空间应该是undefined但这样就会让原型链没有尽头 为了逻辑完善就令其为null 可以看出原形空间的定义是由其定义的原型空间来定义的(实例和其定义共享原型空间)

function Animal(){}
function Bird(){}
function Swallow(){}
Bird.prototype= new Animal()
Swallow.prototype=new Bird() 
var swallow = new Swallow()
console.log(swallow.__proto__.prototype)
console.log(Swallow.__proto__.prototype)
console.log(Bird.__proto__.prototype)
console.log(Animal.__proto__.prototype)
console.log(Function.prototype.__proto__.prototype)
console.log(Swallow.prototype)
console.log(Animal.prototype)
var animal = new Animal
console.log(animal.__proto__.__proto__)
var obj = {}
console.log(typeof (obj.__proto__.__proto__))
////ps没有修正construct

那么若假设Pobject来定义了Object的原型空间的原型空间那么图中所有的(undefined)的位置的_proto_都会指向Pobject的原型空间以这个逻辑就可以让无限迭代下去(指针的指针的.....的指针) 这样向上寻找原型链和向下寻找原型链就统一了,但js设计封锁了向上无限迭代(Object的原型空间为null)

原文链接:segmentfault.com

上一篇:JS核心知识点梳理——异步,单线程,运行机制
下一篇:flipfind

相关推荐

  • (转载)如何通俗易懂的理解Redux

    作者:Wang Namelos 链接:https://www.zhihu.com/questio...(https://www.zhihu.com/question/41312576/answer/9...

    2 年前
  • 面试:彻底理解Cookie以及Cookie安全

    Cookie是什么 Cookie是服务端发送到用户浏览器并且保存到本地的一小块数据,它会在浏览器下次向同一服务器发起请求时,被携带到服务器上。 它的作用: 经常用来做一些用户会话状态管理、个性化设...

    2 个月前
  • 面试官:聊聊对Vue.js框架的理解

    前言 今年OKR定了一条KR是每一个季度进行一次前端相关技术的分享,还有十几天就到2020年了,一直忙于业务开发,没有时间准备和学习高端话题,迫于无奈,那就讲讲平时使用频率较高,却没有真正认真的了解其...

    6 个月前
  • 面试官: 说说你对async的理解

    大家好,我是小雨小雨,致力于分享有趣的、实用的技术文章。 内容分为翻译和原创,如果有问题,欢迎随时评论或私信,希望和大家一起进步。 分享不易,希望能够得到大家的支持和关注。

    2 个月前
  • 面向对象的程序设计——理解对象

    面向对象的程序设计 ECMA262 把对象定义为:无须属性的集合,其属性可以包含基本值、对象或者函数。 理解对象 属性类型 ECMAScript 中有两种属性:数据属性和访问器属性,...

    2 年前
  • 零代码深入浅出React并发模式,带你理解React Fiber架构

    React Fiber架构有一定的复杂度,如果硬着头皮去啃源码,我们会深陷于庞大的代码量和实现细节之中,往往学不到什么东西。 React并发模式是ReactFiber架构的重要应用,本文不贴任何Rea...

    4 个月前
  • 闭包的简单理解

    主要分三部分说: 一、什么是闭包?二、闭包有什么好处?应用在哪里? 1、什么是闭包 第一个特点:可以是函数嵌套函数 第二个特点:内部函数可以引用外部函数的参数和变量 b变量都要被内部...

    2 年前
  • 重新理解闭包,扒出来一个伪闭包?

    七、 问题又来了 按照最先前的说法,函数内部的函数必须被函数外部的一个变量给绑定了,这个函数才不会被垃圾回收机制给释放掉。 那这个闭包内部的函数到底被外部的那个变量给绑架了呢? ...

    2 年前
  • 重新理解async和await

    async 和 await 在干什么 任意一个名称都是有意义的,先从字面意思来理解。async 是“异步”的简写,而 await 可以认为是 async wait 的简写。

    9 个月前
  • 重学前端学习笔记(二十八)--通过四则运算的解释器快速理解编译原理

    笔记说明 重学前端是程劭非(winter)【前手机淘宝前端负责人】在极客时间开的一个专栏,每天10分钟,重构你的前端知识体系(https://time.geekbang.org/column/i...

    1 年前

官方社区

扫码加入 JavaScript 社区