美文网首页
JS中的原型链是什么?

JS中的原型链是什么?

作者: 没事儿啊 | 来源:发表于2017-12-26 23:44 被阅读0次

背景介绍

JS中万物皆对象,但是分为两大类,函数对象,普通对象

所有的函数对象都有一个prototype属性,这个属性引用了一个对象,即原型对象,也称原型。 然而普通对象是没有prototype属性,只有_proto_属性

知识剖析

vara = {};console.log(a.prototype);//undefined

console.log(a.__proto__);//Object {}

var b =function(){}

console.log(b.prototype);//b {}

console.log(b.__proto__);//function() {}

/*1、字面量方式*/

 var a = {};

console.log(a.__proto__);  //Object {}

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

 /*2、构造器方式*/

var A = function(){};

var a = new A();

 console.log(a.__proto__); //A {}

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

 /*3、Object.create()方式*/

var a1 = {a:1}

 var a2 = Object.create(a1);

console.log(a2.__proto__); //Object {a: 1}

console.log(a.__proto__ === a.constructor.prototype); //false

constructor 属性返回对创建此对象的数组函数的引用

_proto_的指向取决于对象创建时的实现方式

大多数情况下,_proto_可以理解为构造器的原型,即:_proto_ === constructor.prototype

但是通过Object.create()创建的对象不使用此等式

functionFoo1(){this.name1 ='1';}

functionFoo2(){this.name2 ='2';}

Foo2.prototype =newFoo1();

functionFoo3(){this.name ='3';}

Foo3.prototype =newFoo2();

varfoo3 =newFoo3();

console.log(foo3);

当我们「读取」 foo3的某个属性得时候,jS 引擎会做下面的事情:

1. 看看 foo3 对象本身有没有这个属性。没有就走到下一步。

2. 看看 foo3.__proto__ 对象有没有这个属性,发现 foo3.__proto__ 有这个属性,于是找到了

3. 如果 foo3.__proto__ 没有,那么浏览器会继续查看 foo3.__proto__.__proto__

4. 如果 foo3.__proto__.__proto__ 也没有,那么浏览器会继续查看 foo3.__proto__.__proto__.proto__

5. 直到找到 或者 __proto__ 为 null。

常见问题

若想访问一个对象的原型,应该使用什么方法?

解决办法

1、使用_proto_属性

每个JS对象一定对应一个原型对象,并从原型对象继承属性和方法。

对象__proto__属性的值就是它所对应的原型对象;

使用__proto__是有争议的,而且是不鼓励的。 它从来没有被包括在EcmaScript语言规范中,但是现代浏览器实现了它, 无论如何。__proto__属性已在ECMAScript 6语言规范中标准化,用于确保Web浏览器的兼容性,因此它未来将被支持。它已被不推荐使用, 建议使用Object.getPrototyOf()

参考文献:

参考一: JS重点整理之JS原型链彻底搞清楚

参考二: 三张图搞懂JavaScript的原型对象与原型链

提问:

Q:prototype和_proto_区别

A:所有的函数对象都有一个prototype属性,这个属性引用了一个对象,即原型对象,也称原型。 然而普通对象是没有prototype属性,只有_proto_属性

Q:constructor 代表什么

A:constructor 属性返回对创建此对象的数组函数的引用

Q:_proto_的指向哪里

A:_proto_的指向取决于对象创建时的实现方式

相关文章

  • 2022前端高频面试题

    JS相关 1.原型和原型链是什么 原型和原型链都是来源于对象而服务于对象的概念js中引用类型都是对象,对象就是属性...

  • 在nodejs中面向对象:Bearcat

    JS中的面向对象 最最最开始,我们先来说说JS中的面向对象。 原型链 参考文章:图解Javascript原型链 J...

  • 廖雪峰JS小记

    (function(){})() 原型,原型链 浅谈Js原型的理解JS 原型与原型链终极详解 对象 对象:一种无序...

  • JS闭包问题(一)

    之前我写过一篇JavaScript原型与原型链的文章,此属于JS中的重难点。 而闭包,是JS中除了原型链之外又一个...

  • javascript中的原型链与继承

    javascript中的原型链与继承javascipt中的原型链和继承机制是这门语言所特有的,但js中的原型机制也...

  • JS的__proto__和prototype

    最近在回顾JS的原型和原型链的知识,熟悉JS的同学都知道JS的继承是靠原型链实现的,那跟原型链相关的属性__pro...

  • JS中的原型链是什么?

    背景介绍 JS中万物皆对象,但是分为两大类,函数对象,普通对象 所有的函数对象都有一个prototype属性,这个...

  • Javascript(三)之原型继承理解

    进阶路线 3 原型继承 3.1 优秀文章 最详尽的 JS 原型与原型链终极详解 一 最详尽的 JS 原型与原型链终...

  • JavaScript原型对象与原型链

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

  • 原型和原型链的简单理解

    原型 在JS中原型就是prototype对象,用来表示类型之间的关系。 原型链 JS中对象和对象之间是有联系的,通...

网友评论

      本文标题:JS中的原型链是什么?

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