prototype: 任何函数(箭头函数除外)都具有一个 prototype属性,该属性是一个对象。一般情况下只有声明function的变量才会有(自动生成)prototype这个属性,而function通过在它的名字前加new 可以创建出属于它的实例。是函数所独有的。

__proto__: 引用类型的__proto__属性是浏览器给他们添加的一个自定义属性,属性值也是一个普通对象。引用类型的__proto__属性指向它们的构造函数的prototype属性。对象所独有的。

constructor: 是一个构造函数,是一种特殊的method。在生成prototype时自动生成的属性,其指向函数本身(在申明函数时,js自动创建该函数的peototype属性)。在用new给一个类创建对象的时候会自动调用该类的构造函数。对象所独有的。

let fn = function() {}
let fn2 = new fn()

关系图解:

prototype

任何函数(箭头函数除外)都具有一个 prototype属性

__proto__

一个对象的__proto__指向产生它的类的prototype。function声明的变量的__proto__指向Function的prototype,其它对象的__proto__指向Object的prototype。每个函数的prototype是一个对象,prototype的__proto__指向一定是Object.prototype。

特殊的Function跟Object

Function:

从控制台分别打印Function的prototype跟__proto__,可以明显的看出来Function的__proto__指向了自己的prototype。

Object:

如上图,Object与Function的__proto__的指向是相同的,都是指向了Function的prototype。

如上图,Object的proptotype又有些不同,没有灰色的<prototype>,在控制台中也可以清楚的看到Object的__proto__指向了null,也可以讲Object.prototype看作为一切之源。

Object的prototype称为源型,将图逆推,

所有通过这个源型创造出的都是object,第一步先创造出Function的prototype,因此这个prototype的__proto__指向源型,然后再通过这个prototype造出Function,因此Function的__proto__指向它自己的prototype,然后用Function造出Object,因此Object的__proto__指向Function的prototype。

peototype是原型,__proto__所指向的以及其后的所有peototype称为原型链。

constructor

对象独有的,它是从一个对象指向一个函数,含义就是指向该对象的构造函数。

根据上文逆推的结论:所有函数和对象最终都是由Function构造函数得来,所以constructor属性的终点就是Function这个函数。

当一个对象不具备constructor时会沿着__proto__到原型链中去找。

总结

感谢两篇博文,内容主要参考博文:https://blog.csdn.net/cc18868876837/article/details/81211729#4_constructor_20https://blog.csdn.net/backee/article/details/83378772

prototype,__proto__,constructor理解的更多相关文章

  1. Javascript Prototype __proto__ constructor 三者的关系

    JavaScript三大毒瘤 --- this,原型链,作用域 在我等菜鸟一步一步升级中的过程中,这三个概念总是困扰这我们(可能只有我吧,我比较蠢).这三个东西往往都很绕,今天我就来分享一下我对原型. ...

  2. js in depth: Object & Function & prototype & __proto__ & constructor & classes inherit

    js in depth: Object & Function & prototype & proto & constructor & classes inher ...

  3. 实践一些js中的prototype, __proto__, constructor

    <!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv ...

  4. prototype,__proto__,constructor

    proto属性: 所有对象都有此属性.但它不是规范里定义的属性,并不是所有JavaScript运行环境都支持.它指向对象的原型,也就是你说的继承链里的原型.通过Object.getPrototypeO ...

  5. 对于JavaScript对象的prototype和__proto__的理解

    一.Object和Function的关系: 刚学JavaScript的时候,看书上说JavaScript中万物皆对象,而javascript中的其他对象都是从Object继承而来,包括内置对象.瞬间觉 ...

  6. Prototype and Constructor in JavaScript

    The concept of prototype in JavaScript is very confusing, especially to those who come with a C++/JA ...

  7. 深入理解JavaScript原型:prototype,__proto__和constructor

    JavaScript语言的原型是前端开发者必须掌握的要点之一,但在使用原型时往往只关注了语法,其深层的原理并未理解透彻.本文结合笔者开发工作中遇到的问题详细讲解JavaScript原型的几个关键概念, ...

  8. 再次理解JS的prototype,__proto__和constructor

    个人总结: 下面这篇文章很好的讲解了js原型,原型链,个人的总结是要记住这三个属性 prototype.__proto__和constructor 首先明确,js中一切都是对象object(A). ( ...

  9. javascript中prototype、constructor以及__proto__之间的三角关系

    三者暧昧关系简单整理 在javascript中,prototype.constructor以及__proto__之间有着“著名”的剪不断理还乱的三角关系,楼主就着自己对它们的浅显认识,来粗略地理理以备 ...

  10. 关于JS call apply 对象、对象实例、prototype、Constructor、__proto__

    关于call与apply的理解容易让人凌乱,这里有个方法可供参考 tiger.call(fox,arg1,arg2...) tiger.apply(fox,[arg1,arg2...]) 理解为 fo ...

随机推荐

  1. linux内核中有哪些子系统(框架)呢?

    注意: 分析用的linux内核版本为5.1.3 1. RTC子系统 2. Remote Processor子系统 3. Remote Processor Message子系统 4. SCSI子系统 5 ...

  2. 使用AOP思想封装JDBC

    看代码 package learning.aop2; import org.springframework.stereotype.Component; import java.sql.SQLExcep ...

  3. 10 Best Practices for Better RESTful API

    转自 http://www.cnblogs.com/mondol/p/6109024.html

  4. 【JVM学习笔记】扩展类加载器

    扩展类加载器独有的特点,代码如下 public class Sample { } public class Test { static { System.out.println("Test ...

  5. rocketMQ配置事故

    公司的binlog消息通知,基于canal采集然后转发到rocketmq推送给业务进行消费. 基于此机制,为了实现实时计算通用源端处理,订阅了若干rocketmq的topic进行数据的幂等事务性投递到 ...

  6. JSX AS DSL? 写个 Mock API 服务器看看

    这几天打算写一个简单的 API Mock 服务器,老生常谈哈?其实我是想讲 JSX, Mock 服务器只是一个幌子. 我在寻找一种更简洁.方便.同时又可以灵活扩展的.和别人不太一样的方式,来定义各种 ...

  7. 【HANA系列】对话SAP全球CEO孟鼎铭:未来最大的发展机遇属于中国中小企业

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]对话SAP全球CEO孟鼎铭:未来 ...

  8. 齐治堡垒机ShtermClient-2.1.1命令执行漏洞(CNVD-2019-09593)分析

    一.基本信息 参考:https://www.cnvd.org.cn/flaw/show/1559039 补丁信息:该漏洞的修复补丁已于2019年4月1日发布.如果客户尚未修复该补丁,可联系齐治科技的技 ...

  9. Zookeeper白话解释

    官方的解释:Zookeeper提供了诸如统一命名空间服务,配置服务和分布式锁等分布式基础服务. 嗯,说上面这个话的人,良心不会痛吗? Zookeeper功能如上边说到的:统一命名空间服务 其他就tm跟 ...

  10. Attention is all you need 详细解读

    自从Attention机制在提出之后,加入Attention的Seq2Seq模型在各个任务上都有了提升,所以现在的seq2seq模型指的都是结合rnn和attention的模型.传统的基于RNN的Se ...