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

JS原型和原型链

作者: 混吃等死小前端 | 来源:发表于2020-03-10 10:16 被阅读0次
构造函数:function F1 (){};
实例对象:let f1 = new F1();

Object.prototype.toString.call(F1) // "[object Function]"
Object.prototype.toString.call(f1) // "[object Object]"

一、原型

也是一个对象(被继承的对象被称作原型)。用来给实例共享属性和方法(实例对象可以继承原型对象的属性)

继承:当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到一个名字匹配的属性或到达原型链的末尾(null)

1、指向原型的属性
  • prototype

函数才会有的属性,该属性指向原型(也是一个对象,包含_proto_和constructor)

console.log(f1.prototype) //undefined
console.log(F1.prototype) ↓↓↓↓
image.png
  • _proto_

除null以外每一个js对象都具备的属性,构造函数实例化的对象 使用这个属性来指向 构造函数的原型

console.log(f1.__proto__ === F1.prototype) // true
console.log(f1.__proto__) // ↓↓↓↓
image.png image.png
2、指向构造函数的属性
  • constructor

每个原型(F1.prototypef1._proto_)的该属性都指向关联的构造函数

F1.prototype.constructor // F1(){}
f1.__proto__.constructor // F1(){}
f1.constructor // F1(){} 实例对象可以继承原型对象的属性

二、原型链

每个对象使用_proto_直到值为null的链

f1.__proto__ === F1.prototype // true
F1.prototype.__proto__ === Object.prototype // true
Object.prototype.__proto__ === null // true

f1.__proto__.__proto__.__proto__ // null

相关文章

  • 廖雪峰JS小记

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

  • JS的__proto__和prototype

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

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

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

  • 2022前端高频面试题

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

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

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

  • 深入javascript之原型和原型链

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

  • JavaScript原型对象与原型链

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

  • 原型和原型链

    今天发现一张特别好的图(↑↑↑上图↑↑↑),对原型和原型链的理解特别直观友好。 原型和原型链 基础储备:每个 JS...

  • 2018-01-09 关于javascript原型链的思考 pl

    s 深入理解原型和原型链? 构造函数 理解原型和原型链 new的时候js都干了什么? 一个实现继承的demo 构造...

  • js基础(三)

    js基础 原型链和原型对象 ... ... js没有继承原型对象prototype通常用来添加公共的属性或行为且只...

网友评论

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

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