简述原型链是什么,有什么用处?

这里是修真院前端小课堂,每篇分享文从

【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】

八个方面深度解析前端知识/技能,本篇分享的是:

【简述原型链是什么,有什么用处?】

 

【修真院web小课堂】

大家好,我是IT修真院上海分院第8期的学员周能,一枚正直纯洁善良的web程序员,今天给大家分享一下,修真院官网web任务4,深度思考中的知识点——简述原型链是什么,有什么用处?若想访问一个对象的原型,应该使用什么方法

 

 
(1)背景介绍:
什么是原型

一个函数可以看成一个类,原型是所有类都有的一个属性,原型的作用就是给这个类的每一个对象都添加一个统一的方法

 

 

PROTOTYPE

JS都是用new来从构造函数生成一个实例对象

构造函数生成的实例无法共享属性和方法,考虑到这点于是将prototype属性引入到了JS中

PROTOTYPE这个属性包含一个对象,里面放着所有实例需要共享的方法和属性,而不需要共享的属性和方法可以放在构造函数中

由于所有的实例对象共享同一个prototype对象,那么从外界看起来,prototype对象就好像是实例对象的原型,而实例对象则好像"继承"了prototype对象一样。

 

 

(2)知识剖析:
__PROTO__和PROTOTYPE

每个对象都有一个__proto__属性,而prototype只有函数才有

简述原型链是什么,有什么用处?_第1张图片

对象是由构造函数创建的,函数也是对象,函数是由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__是一样

你可能感兴趣的:(简述原型链是什么,有什么用处?)