原型和原型链 | 青训营笔记

73 阅读3分钟

浅谈原型和原型链 | 青训营笔记

image.png

这是我参与「第四届青训营」笔记创作活动的第1天。\color{brown}{这是我参与「第四届青训营 」笔记创作活动的第1天。}

设计模式——原型模式

在[前端设计模式应用]这门课程中,吴立宁老师提到了JavaScript中对象实现的基础,原型以及原型链。原型是使得JS中的对象不同于其他传统的面向对象语言,如C++,Java等中的对象的根本原因。了解原型可以使得我们明白JavaScript的一些特殊的机制,从而使我们在使用JavaScript编程时有更广泛的思路以及更方便的写法。

什么是原型,什么是原型链

为什么需要原型

在传统的构造函数中,如果为一个对象创建了一个方法,那么在每一个实例对象中都被添加了一个方法,这么做有一个坏的影响就是会浪费内存空间。而JavaScript通过原型就很好的解决了这个问题。

原型带来的解决方案

如果粗略的来理解的话,实例对象所需要的共用方法会被添加到原型上,实例对象的私有属性则在构造函数内部。


因为这次的课程是对于前端的设计模式的介绍,所以对于每一种设计模式并没有进行非常详细解读,所以在下面的文章中,我结合了我个人的理解以及互联网上的资料来进一步的说明原型。

prototpye属性

prototype就是英文的原型,在所有的函数之中,都有prototype属性,这个属性的值是对应的原型对象。我们在上文中提到,原型对象包含一些可以被所有实例对象共享的属性和方法。

constructor属性

原型对象中默认拥有的一个不可枚举的属性,它的值是对构造函数的引用。如果一个对象实例的构造封装了其他的构造函数,那么原型对象就会串联起来,形成一个原型链。

原型链的实际运用过程

就我目前所知,在读一个对象的属性时,会有一个在原型链上寻找的过程。

  1. 在对象自身中查找
  2. 找不到就沿着原型链向上查找
  3. 没有找到,返回undefined

总结

在这次的前端的课程的学习中,老师提到了原型这个JS非常有名的设计模式,于是在此写下了此篇笔记来记录对于原型知识的理解。本人对于前端知识的理解还很浅薄,对于原型的知识会有误解与遗漏的地方。这也是我第一次使用掘金编辑器编写笔记文章,有什么不足的地方也欢迎各位指正。希望在今后的学习中能对知识有更加深刻的理解,以及能够写出更有价值的笔记文章