简述原型链是什么,有什么用处?
这里是修真院前端小课堂,每篇分享文从
【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】
八个方面深度解析前端知识/技能,本篇分享的是:
【简述原型链是什么,有什么用处?】
【修真院web小课堂】
大家好,我是IT修真院上海分院第8期的学员周能,一枚正直纯洁善良的web程序员,今天给大家分享一下,修真院官网web任务4,深度思考中的知识点——简述原型链是什么,有什么用处?若想访问一个对象的原型,应该使用什么方法
(1)背景介绍:
什么是原型
一个函数可以看成一个类,原型是所有类都有的一个属性,原型的作用就是给这个类的每一个对象都添加一个统一的方法
PROTOTYPE
JS都是用new来从构造函数生成一个实例对象
构造函数生成的实例无法共享属性和方法,考虑到这点于是将prototype属性引入到了JS中
PROTOTYPE这个属性包含一个对象,里面放着所有实例需要共享的方法和属性,而不需要共享的属性和方法可以放在构造函数中
由于所有的实例对象共享同一个prototype对象,那么从外界看起来,prototype对象就好像是实例对象的原型,而实例对象则好像"继承"了prototype对象一样。
(2)知识剖析:
__PROTO__和PROTOTYPE
每个对象都有一个__proto__属性,而prototype只有函数才有
对象是由构造函数创建的,函数也是对象,函数是由Function创建的,对象的__proto__等于创建者的prototype
什么是原型链
每个对象都有一个__proto__,它指向它的prototype原型对象,而prototype原型对象又具有一个自己的原型对象,就这样层层向下上直到一个对象的原型prototype为null 这个查询的路径就是原型链
(3)常见问题:
如何访问一个对象的原型?
(4)解决方案:
__PROTO__,PROTOTYPE,OBJECT.GETPROTOTYPEOF()
prototype,只有函数对象才拥有一个属性,用来访问其原型对象
__proto__,是任何引用类型都拥有的属性,指向其构造函数的prototype,但是并不是标准写法,是一个特殊的内部属性
Object.getPrototypeOf()该属性是ES5引入的一个标准属性,用来获取对象的原型,其作用和__proto__是一样
function Pig(name) {
this.name = name
}
var a = new Pig("胖胖");
var b = new Pig("瘦瘦");
Pig.prototype.like = "red"
a.__proto__.like="red";
Object.getPrototypeOf(a).like="red"
(5)编码实战:
(6)拓展思考:
使用PROTOTYPE需要注意什么
尽量去修改增添,使用对象字面量创建原型方法要谨慎
function Pig(name) {
this.name = name
}
Pig.prototype = {//这个写法必须写到最上面,必须要在实例对象前面
like: "red",
}
var a = new Pig("胖胖");
var b = new Pig("瘦瘦");
Object.getPrototypeOf(a).like="red"
(7)参考文献:
https://www.jb51.net/article/...
https://zhuanlan.zhihu.com/p/...
(8)更多讨论:
1、什么是原型?
答:一个函数可以看成一个类,原型是所有类都有的一个属性,原型的作用就是给这个类的每一个对象都添加一个统一的方法
2、什么是原型链
答:每个对象都有一个__proto__,它指向它的prototype原型对象,而prototype原型对象又具有一个自己的原型对象,就这样层层向下上直到一个对 象的原型prototype为null 这个查询的路径就是原型链
3、如何访问一个对象的原型?
答:prototype,只有函数对象才拥有一个属性,用来访问其原型对象
__proto__,是任何引用类型都拥有的属性,指向其构造函数的prototype,但是并不是标准写法,是一个特殊的内部属性
Object.getPrototypeOf()该属性是ES5引入的一个标准属性,用来获取对象的原型,其作用和__proto__是一样
简述原型链是什么,有什么用处?相关推荐
- 【JS对象】打败JS原型、原型链大恶魔方法详解
文章目录 什么是对象? 什么是面向对象? 创建对象的方式 原型是什么? __proto__属性 constructor属性 原型链 函数的定义类型有哪些? 函数也是一个对象 完整的原型链 打败恶魔第一 ...
- 简述js原型链_简述js
简述js原型链 (在React 16.8.0之前)((before React 16.8.0)) Yeah, I know that there are terabytes of data avail ...
- 简述JS原型、原型链
该文是本人对原型和原型链的个人理解,若有错,请指出. 原型 原型:每个构造函数都有一个prototype属性,该属性指向一个object空对象,这个对象就是函数实例的原型对象(也称为原型). 原型作用 ...
- 从原型链看DOM--Node类型
前言: 本系列从原型,原型链,属性类型等方面下手学习了DOM文档对象模型,旨在弄清我们在DOM中常用的每一个属性和方法都清楚它从哪里来要到哪里做什么事,这样对于理解代码有一定启发.全靠自己在总结中摸索 ...
- 一文读懂vuex4源码,原来provide/inject就是妙用了原型链?
1. 前言 你好,我是若川,欢迎加我微信ruochuan12,加群长期交流学习. 这是学习源码整体架构系列 之 vuex4 源码(第十篇).学习源码整体架构系列文章(有哪些必看的JS库):jQuery ...
- JavaScript系列之详解原型和原型链
文章の目录 1.prototype 2.__proto__ 3.constructor 4.实例与原型 5.原型的原型 6.原型链 参考 写在最后 1.prototype 在 JavaScript 中 ...
- 浅谈js原型和原型链
一.简述 对于javascript 对象(函数) 原型和原型链的理解,其实不那么难,简单来说,需要理解什么是原型,怎么访问原型,什么是原型链,怎么通过原型链去访问原型,就可以大概理清楚原型和原型链的基 ...
- Javascript中的原型链、prototype、__proto__的关系
javascript 2016-10-06 1120 9 上图是本宝宝用Illustrator制作的可视化信息图,希望能帮你理清Javascript对象与__proto__.prototype和 ...
- JavaScript原型对象与原型链
JavaScript原型对象与原型链 在JavaScript实际项目中,对象是十分重要的一种类型 无论是作为数据表现的一种形式或配置成工厂模式制造实例等等,这些用途在实际项目开发中都使用得非常广泛 依 ...
最新文章
- 【pytorch】nn.GRU的使用
- js源生惯性滚动与回弹(备用)
- 小技巧textbox的行数
- 一个项目学会前端实现登录拦截
- 【解析】人人网:我的青春小鸟一样不回来
- 【R】Rstudio set up
- docker配置 注册中心
- selenium 3.0鼠标事件 (java代码)
- Python处理Excel数据的方法
- c语言英文字母降序排列,英文单词排序
- 清华计算机自主招生试题,2017年清华大学自主招生笔试真题及答案汇总|2017自主招生笔试真题(清华大学)|清华大学2017年自主招生笔试真题...
- Python实现自动给视频打码,减少不宜画面出现...
- 舔狗不会永远舔你的爱答不理和高冷
- 这可能是我用过最好用的SQL工具,免费还免安装,良心推荐SQL Studio
- 2.Deep Neural Networks are Easily Fooled
- Linux 系统调用的本质
- python操作键盘输入中文_python模拟鼠标点击和键盘输入的操作
- k折(k-fold)交叉验证
- 四平方和定理_简化循环
- 安装Linux详细教程