美文网首页前端基础知识记录
JS中的原型和原型链

JS中的原型和原型链

作者: 大写的Q | 来源:发表于2017-03-14 01:54 被阅读121次

这可能是一个常看常新的问题,因为。。我总是记不住。所以来写一篇,顺便加深一下自己的记忆。

先说prototype。

每创建一个新函数,都会创建一个prototype(原型)属性,例如:

function Person() {}

var person1 = new Person();

var person2 = new Person();

constructor和prototype

如上图所示,person1和person2内部的指针都指向了Person.prototype,而不是Person本身。

这个(prototype)属性是一个指针,指向函数的原型对象。所有原型对象都会自动获得一个constructor(构造函数)属性,这个属性指向prototype属性所在函数的指针。如上述例子中,Person.prototype.constructor 就指向Person。

JS中提供了isPrototypeOf()和getPrototypeOf()来进行原型的判断和获取原型。大部分浏览器都支持这种写法。IE9以下是不提供的。

需注意的是,当代码读取某个对象的属性时,它会先对该对象进行搜索,搜索不到的时候会去它指向的原型对象去搜索。如person1.name,在没有定义的情况下就会去Person.prototype里面寻找,从而返回“Nicholas”。

接下来谈一下原型链。

原型链的基本思想,是利用原型让一个引用类型继承另一个引用类型的属性和方法。也就是说,函数A()有一个原型对象A.prototype,A.prototype包含一个指向A的指针,这时候实例B=new A(), B就包含了一个指向A.prototype的指针。那么如果这时让A.prototype = new C()呢?这时候A.prototype就包含了一个指向C的指针,如果C.prototype 又等于new D()......就这样层层递进,就构成了实例与原型的链条。以上就是原型链的基本概念。

要想确定原型和实例之间的关系,

第一种方法是instanceof操作符。例如: B instanceof Object; B instanceof A; B instanceof C; 结果都为true

第二种方法是isPrototypeOf()。例如: A.prototype.isPropotypeOf(B); 结果也为true。

原型链最大的弊端就是引用类型的属性会被所有实例共享,实践中很少单独使用原型链。但是这些原理还是需要弄明白的,以上就是本次总结的全部知识点啦,下次再聊~

欢迎来留言

参考:《JavaScript高级程序设计》(第3版)

相关文章

  • 2022前端高频面试题

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

  • JavaScript原型对象与原型链

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

  • 深入javascript之原型和原型链

    原型和原型链是js中的难点也是重点,明白了原型和原型链会让我们在后面不管是学习还是工作都会更加高效,并且原型和原型...

  • 廖雪峰JS小记

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

  • JS的__proto__和prototype

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

  • javascript中的原型链与继承

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

  • 原型对象和原型链二者的关系

    开篇 之前对js中的原型链和原型对象有所了解,每当别人问我什么是原型链和原型对象时,我总是用很官方(其实自己不懂)...

  • 一个例子让你彻底明白原型对象和原型链

    开篇 之前对js中的原型链和原型对象有所了解,每当别人问我什么是原型链和原型对象时,我总是用很官方(其实自己不懂)...

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

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

  • 原型与新版的类-class

    首先来理解原型原型 === 共用属性可以先看看方姐的几篇文章:什么是JS原型链JS 中 proto 和 proto...

网友评论

    本文标题:JS中的原型和原型链

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