一张图瞬间让你明白原型链结构

看图之前我们首先来了解几个对象原型的基本知识:
    例子:
    function Fn() {}// Fn为构造函数
    var f1 = new Fn();//f1是Fn构造函数创建出来的对象
    构造函数的prototype属性值就是对象原型。(Fn.prototype就是对象的原型)
    构造函数的prototype属性值的类型就是对象  typeof Fn.prototype===object.
    对象原型中的constructor属性指向构造函数 (Fn.prototype.constructor===Fn)
    对象的__proto__属性值就是对象的原型。(f1.__proto__就是对象原型)
    Fn.prototype===f1.__proto__ 其实它们两个就是同一个对象---对象的原型。
    所有Fn.prototype.__proto__===Object.prototype
    typeof Object.prototype ===object。
    Object.prototype.__proto__===null。

    我讨论原型就是指的对象与原型对象之间的关系。所以原型链也称之为对象链。
    有了以上的基础知识,下面的原型链图你就可以看明白了。

所以对象f1的原型链:f1.__proto__---->Fn.prototype.__proto__----->Object.prototype.__prototype__---->null

时间: 2024-10-19 09:47:52

一张图瞬间让你明白原型链结构的相关文章

js原型链结构与链表结构对比

在结构上多一个指向自身的constructor构造函数,这就是原型链够简单吧. 利用原型链结构实现继承和向链表中插入节点,有区别吗? 没区别!! 原文地址:https://www.cnblogs.com/whnba/p/10291665.html

三张图让你快速明白activity与fragment生命周期的异同点

第一张图:activity的生命周期 第二张图:fragment的生命周期 第三张图:activity与fragment生命周期对比 补充:如果你还是不明白,请翻译一下你不理解的对应单词. ---------------------------------------------------------------------------------------- 有什么问题,大家可以一起交流-- 更多精彩关于关注博主的微信订阅号:非常周末 微信搜索:非常周末 你可以扫描一下关注即可:

一张图让你彻底明白线程生命周期

以下是对应的状态机说明: 0到4分别表示:CREATED, TERMINATED,RUNNABLE, RUNNING 和 NON_RUNNABLE THREAD = CREATED, CREATED = (start ->RUNNABLE |stop ->TERMINATED), RUNNING = ({suspend,sleep}->NON_RUNNABLE |yield ->RUNNABLE |{stop, end} ->TERMINATED | run ->RUN

一张图看懂Function和Object的关系及简述instanceof运算符

我在写一篇图解prototype和__proto__的区别时,搜资料搜到了一个有意思的现象,下面这两个运算返回的结果是一样的: Function instanceof Object;//true Object instanceof Function;//true 这个是怎么一回事呢?要从运算符instanceof说起. 一.instanceof究竟是运算什么的? 我曾经简单理解instanceof只是检测一个对象是否是另个对象new出来的实例(例如var a = new Object(),a i

JavaScript ---- 原型,原型链(什么是原型)

和"闭包"一样,"原型"这个概念也经常被提起. 其实这个"概念"应该和构造函数,对象放在一起讲,但是由于时间关系,先把这部分抽取出来讲.再讲这个概念时我们先大致了解下JavaScript中的"对象". 什么是对象? JavaScript权威指南中给的解释是:对象是一种复合数据类型,它们将多个数据值集中在一个单元中,而且允许使用名字来存取这些值.或者是一个无序的属性集合,每个属性都有自己的名字和值. 什么是原型? 我们创建一个空

JavaScript 深入之从原型到原型链(转载)

构造函数创建对象 我们先使用构造函数创建一个对象: function Person() { } var person = new Person(); person.name = 'name'; console.log(person.name) // name 在这个例子中,Person就是一个构造函数,我们使用new创建了一个实例对象person. 很简单吧,接下来进入正题: prototype 每个函数都有一个prototype属性,就是我们经常在各种例子中看到的那个prototype,比如:

JavaScript深入系列(一)--原型和原型链详解

构造函数创建对象 首先我们先使用构造函数创建一个对象: function Person(){} var person = new Person(); person.name = 'tom'; console.log(person.name) //tom 在这个例子中,Person就是一个构造函数,我们使用new创建了一个实例对象person.接下来,进入正题: prototype 每个函数都有一个prototype属性,就是我们经常在各种例子中看到的那个prototype,比如: functio

JavaScript原型与原型链

一.数据类型 JavaScript的数据类型可以分为基本数据类型和引用数据类型. 基本数据类型(6种) String Number Boolean null undefined Symbol(ES6) 引用数据类型 Object 二.面向对象编程 构造函数 面向对象编程的第一步,就是要生成对象.前面说过,对象是单个实物的抽象.通常需要一个模板,表示某一类实物的共同特征,然后对象根据这个模板生成. JavaScript 语言使用构造函数(constructor)作为对象的模板.所谓"构造函数&qu

如何理解JavaScript中的原型和原型链

首先是一张关系图,避免抽象化理解时产生的困难 Function对象 函数对象是JavaScript学习中不可避免的一部分,而且这一部分相对重要且抽象 函数的创建方式有2种: 字面量创建 var foo = function(){ console.log("test"); } new 关键字创建实例对象 //let 函数名 = new Function(“参数列表”,”函数体”); let sum = new Function("num1,num2","re