美文网首页
JavaScript 原型和原型链

JavaScript 原型和原型链

作者: 不讨喜的大雄 | 来源:发表于2018-07-12 00:39 被阅读0次

JavaScript 中除了基础类型外的数据类型,都是对象(引用类型)。但是由于其没有 类(class,ES6 引入了 class,但其只是语法糖)的概念,如何将所有对象联系起来就成立一个问题,于是就有了原型和原型链的概念。


每个实例对象( object )都有一个私有属性(称之为 __proto__ )指向它的构造函数的原型对象(prototype )。该原型对象也有一个自己的原型对象( __proto__ ) ,层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节

上面是 MDN里有关原型链知识 的摘录,什么意思?让我们来解释一下

事实上 JavaScript 所有数据都可以以对象的形式表现:由于函数是对象,我们可以用构造函数的方法使得 Number、Boolean、String 变成对象。

下面以 Number 为例 (其他类型也一样)

可以用 var 基本类型 = new 对应基本类型的函数() 的方法创建一个新函数

var n = new Number() 创建一个 Number 函数,其是一个对象

这里的 n 就是 Number 的实例对象,可以看到 n 里面有一个 __proto__ 指向 Number 所指向的原型对象(也是 n 自己本身的原型对象),Number 为 n 的构造函数,它通过 prototype 指向自己的原型对象,而后又可以通过 constructor 指向回 Number 本身;

而 Number 函数也有一个 __proto__ 指向 Object 这个构造函数的原型对象,Object 通过 prototype 指向自己原型对象 ;

Object 函数没有 __proto__,证明其已经到达最后的属性层,他的 __proto__ 指向为 null。

原型链

以上一整个原型与原型层层相链接的过程即为原型链

其可以将公用属性存放在同一原型层中,实现继承、节省内存空间等。

当您访问实例的属性时,JavaScript 首先会检查它们是否直接存在于该对象上,如果不存在,则会 [[Prototype]] 中查找。这意味着你在 prototype 中定义的所有内容都可以由所有实例有效共享,你甚至可以稍后更改部分 prototype,并在所有现有实例中显示更改(如果需要)。


通过以上例子我们可以得到下面两个“公式”

var 对象 = new 函数()

对象.__proto__ === 对象的构造函数.prototype

我们已经知道

var n = new Number()

n.__proto__ === Number.prototype //true

那么 Number.__proto__

Number 的构造函数是 Function,即 Number 是 Function 的实例

即有 Number.__proto__ === Function.prototype

那么同理

var object = new Object()

object.__proto__ === Object.prototype

Object.__proto__ === Function.prototype

再进一步推断

var function = new Function()

function.__proto__ === Function.prototype

Function.__proto__ === Function.prototype


本文主要用于个人学习使用,如有侵权请联系我删除。

参考及推荐:

继承与原型链

Javascript继承机制的设计思想

白话原型和原型链

JavaScript深入之从原型到原型链 #2

饥人谷课件-原型链和继承

相关文章

  • JavaScript 原型、原型链与原型继承

    原型,原型链与原型继承 用自己的方式理解原型,原型链和原型继承 javascript——原型与原型链 JavaSc...

  • 原型和原型链篇

    原型和原型链 1.理解原型设计模式以及JavaScript中的原型规则 原型设计模式JavaScript是一种基于...

  • 原型、原型链

    (什么是原型、原型链?有什么作用) JavaScirpt深入之从原型到原型链 图解 Javascript 原型链 ...

  • js原型、原型链、继承的理解

    一、原型、原型链 原型是Javascript中的继承的基础,JavaScript的继承主要依靠原型链来实现的。 原...

  • 【javascript】继承

    javascript只支持实现继承,而且继承主要是依靠原型链来实现的。 原型链 javascript将原型链作为实...

  • 4.4 JavaScript

    4.4.1. 原型链 4.4.1.1. 显式原型和隐式原型   JavaScript的原型分为显式原型(expli...

  • 关于JS中的原型和原型链

    目录 关于js 对象和原型 原型链 基于原型链的继承 参考资料ECMAScript 6 入门JavaScript原...

  • javascript碎片知识001

    javascript中的对象(原型,原型链) 什么是原型? 原型是JavaScript中的继承的基础,JavaSc...

  • JS进阶(1) —— 人人都能懂的构造函数

    大家都知道原型和原型链是 JavaScript 中最经典的问题之一,而构造函数又是原型和原型链的基础,所以先了解清...

  • JavaScript原型对象与原型链

    一、前言 原型和原型链是 JavaScript中不可避免需要碰到的知识点,在刚开始学习 JS 时,原型和原型链都是...

网友评论

      本文标题:JavaScript 原型和原型链

      本文链接:https://www.haomeiwen.com/subject/flskpftx.html