在开始之前,必须要知道的是:对象具有__proto__、constructor(函数也是对象固也具有以上)属性,而函数独有prototype

在博客园看到一张图分析到位很彻底,这里共享:

刚开始看这图很懵,根本看不懂,但是细品,多品后恍然大悟,然后总结出以下几点,很重要切记

1、切记:对象的内置属性__proto__一定指向的是它构造函数的原型对象

2、切记:对象的内置属性__proto__.__proto__一定指向Object原型对象(Object.prototype)

3、切记:对象的内置属性__proto__.__proto__.__proto__一定最终为null

4、切记:每个函数都具有独有的prototype,这个对象包含了此函数的所有实例共享的属性和方法(函数=》对象)

5、切记:对象的属性__proto__指向的是其构造函数的原型对象(对象=》对象),而对象的属性constructor指向的是其构造函数(对象=》函数)

一定要把上面几句彻底搞懂,然后随便上几个例子

var abc = {};

=====================

var abc1= "111";

=====================

var abc2=123;

=====================

function abc3(){}

=====================

var abc4=new Date();

=====================

function AcFun(){};

var abc5=new AcFun();

=====================

看打印结果:

console.log(abc.__proto__ === Object.prototype);  //true

console.log(abc1.__proto__ === String.prototype); //true

console.log(abc2.__proto__ === Number.prototype); //true

console.log(abc3.__proto__ === Function.prototype); //true

console.log(abc3.prototype.__proto__ === Object.prototype); //true

console.log(abc4.__proto__ === Date.prototype); //true

console.log(abc5.__proto__ === AcFun.prototype); //true

console.log(AcFun.prototype.__proto__ === Object.prototype); //true

console.log(AcFun.__proto__ === Function.prototype); //true

console.log(abc4.__proto__.__proto__ === Object.prototype); //true

console.log(abc4.__proto__.__proto__.__proto__ === null); //true

console.log(abc3.constructor === Function); //true

console.log(abc5.constructor === AcFun); //true

console.log(abc3.constructor.__proto__=== Function.prototype); //true

console.log(abc3.constructor.__proto__.__proto__ === Object.prototype); //true

console.log(abc3.prototype.__proto__.constructor === Object); //true

console.log(AcFun.prototype.constructor === AcFun); //true

console.log(AcFun.__proto__.constructor === Function); //true

最后总结:所有对象都有属性__proto__及constructor(包括函数),只有函数独有prototype,所有对象的__proto__都指向其构造函数的原型(对象),consturctor指向的其构造函数(函数),而函数的prototype则指向其函数原型对象(对象),及f1.__proto__ === Foo.prototype、f1.constructor === Foo

彻底搞懂js __proto__ prototype constructor的更多相关文章

  1. 帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)

    作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞 ...

  2. 彻底搞懂 JS 中 this 机制

    彻底搞懂 JS 中 this 机制 摘要:本文属于原创,欢迎转载,转载请保留出处:https://github.com/jasonGeng88/blog 目录 this 是什么 this 的四种绑定规 ...

  3. 让你彻底搞懂JS中复杂运算符==

    让你彻底搞懂JS中复杂运算符== 大家知道,==是JavaScript中比较复杂的一个运算符.它的运算规则奇怪,容易让人犯错,从而成为JavaScript中“最糟糕的特性”之一. 在仔细阅读了ECMA ...

  4. 一文搞懂 js 中的各种 for 循环的不同之处

    一文搞懂 js 中的各种 for 循环的不同之处 See the Pen for...in vs for...of by xgqfrms (@xgqfrms) on CodePen. for &quo ...

  5. 彻底搞懂js原型与原型链

    原生的原型链 function fn(){},fn 为 Function的一个实例,原型链为 null -> Object -> Function -> fn: fn.__proto ...

  6. Spirit带你彻底搞懂JS的6种继承方案

    JavaScript中实现继承的6种方案 01-原型链的继承方案 function Person(){ this.name="czx"; } function Student(){ ...

  7. 一文搞懂js中的typeof用法

    基础 typeof 运算符是 javascript 的基础知识点,尽管它存在一定的局限性(见下文),但在前端js的实际编码过程中,仍然是使用比较多的类型判断方式. 因此,掌握该运算符的特点,对于写出好 ...

  8. 通过一张简单的图,让你彻底地搞懂JS的==运算

    大家知道,JavaScript中的==是一种比较复杂运算,它的运算规则很奇怪,很容易让人犯错,从而成为JavaScript中“最糟糕的特性”之一. 在仔细阅读ECMAScript规范的基础上,我画了一 ...

  9. 晨叔技术晨报: 你真的搞懂JS中的“值传递”和“引用传递”吗?

    晨叔周刊,每周一话题,技术天天涨. 本周的话题是JS的内存问题(加入本周话题,请点击传送门). 图 话题入口 今天的技术晨报来,就来谈谈JS中变量的,值传递和引用传递的问题.现在,对于很多的JSer来 ...

随机推荐

  1. BPMN开源工作流编辑器bpmn-js落地实践中文文档

    BPMN是一套标准的业务流程建模符号规范,bpmn-js是基于此规范实现的一套渲染工具包和web建模器,可以实现拖拽生成工作流程图,效果大概如下 最近刚好用到,研究之后写了系列文章,分享给有需要的小伙 ...

  2. Android studio设置参数文档提示

    方法/步骤     进行点击Android studio菜单中的file的选项菜单.   弹出了下拉菜单中进行选择为"settings"的选项的菜单即可.   进入到了settin ...

  3. 【linux】gpio子系统

    目录 前言 linux子系统 gpio子系统 gpio子系统实战-系统调用 前言 目前不涉及驱动源码 参考链接 linux子系统 在 Linux 系统中 绝大多数硬件设备都有非常成熟的驱动框架 驱动工 ...

  4. rootfs如何取消登录超时

    一种简便的办法,在etc/inittab文件中,增加一行::respawn:-/bin/login.之后当登录超时后,还会在进入到登录界面,就不会出现登录超时后无法在登录的问题了. #first:ru ...

  5. 用十一张图讲清楚,当你CRUD时BufferPool中发生了什么!以及BufferPool的优化!

    一.收到了大佬们的建议 1.篇幅偏短,建议稍微加长一点. 这点说的确实挺对,有的篇幅确实比较短,针对这个提议我会考虑将相似的话题放在一篇文章中.但是这可能会导致我中断每天更新的步调,换成隔几天发一篇的 ...

  6. [代码审计]:PhpMyWind储存型XSS漏洞(CVE-2017-12984)

    简介 今天开启一下代码审计的篇章  python安全编程剩下的看起来没意思就结束了 ,现在规划每2周写一个爬虫练练手, 然后今天开启代码审计和Docker的学习 我个人感觉先看漏洞利用过程再看漏洞分析 ...

  7. java开发两年,连Spring的依赖注入的方式都搞不清楚,你工作可能有点悬!

    Spring依赖注入 常的java开发中,程序员在某个类中需要依赖其它类的方法,则通常是new一个依赖类再调用类实例的方法,这种开发存在的问题是new的类实例不好统一管理,spring提出了依赖注入的 ...

  8. tcp连接的三次握手

    为什么tcp连接需要三次握手才能建立连接 主要是为了初始化sequence number的初始值,通信的双方要互相通知双方的sequence number,这个要作为以后数据通信的序号,保证以后不会因 ...

  9. ClassLoader分类

    对于类装载器而言一共有三种, 1分别是加载rt包下的Bootstrap加载器,是用C++写的,是在java最早发布的时候写的,用于加载那些最初的类. 2然后java在发展过程中又要发布新的jdk,所以 ...

  10. Redis 基础设计结构之四 set(集合)

    Redis 有 5 种基础数据结构,分别为:string (字符串).list (列表).set (集合).hash (哈希) 和 zset (有序集合). 今天来说一下set(集合)这种存储结构,s ...