重要知识点:每节博客都会重复🙉🙉🙉
口诀🤨:四基两空一对象,还有五个falsy值。
七种数据类型
- number string bool symbol
- null undefined
- object
五个 falsy 值
- null undefined
- 0 NaN
- '' (空字符串)
重点讲 Object 对象🤡
我一直很难理解 Javascript 语言的继承机制。
它没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instance)的区分,全靠一种很奇特的"原型链"(prototype chain)模式,来实现继承。
我花了很多时间,学习这个部分,还做了很多笔记。但是都属于强行记忆,无法从根本上理解。
直到昨天,我读到 阮一峰 的解释,才恍然大悟,完全明白了Javascript为什么这样设计。
下面,我尝试用自己的语言,来解释它的设计思想。彻底说明白prototype对象到底是怎么回事。其实根本就没那么复杂,真相非常简单。
一、引子
在解释原型概念之前,我们先讲个故事…… 有两个人,分别叫小红和小兰,他们除了名字不一样,都有共同特征(都是中国人,都是黄皮肤,都是黑头发),那我在存储这两个人的数据时,该怎么存呢?哪种方式内存小呢???
方法A: 各存各的,小红+{中国人、黄皮肤、黑头发}、小蓝+{中国人、黄皮肤、黑头发}
方法B: 小红+{共有属性地址}小蓝+{共有属性地址} 、{共有属性}
显而易见,当这种共同属性越来越多时,方法B的内存就占得越少,而JS也是这么想的!!!
每一个实例对象,都有自己的属性和方法的副本。这不仅无法做到数据共享,也是极大的资源浪费。
二、什么是原型
每个对象都有原型
- 原型里存着对象的共有属性
- 比如 obj 的原型就是一个对象
- obj.
__proto__
存着这个对象的地址,地址指向的是他们的共有属性,这些共有属性就叫做原型。 - 这个对象里有 toString / constructor / valueOf 等属性
对象的原型也是对象
- 所以对象的原型也有原型
- obj = {} 的原型即为所有对象的原型
- 这个原型包含所有对象的共有属性,是对象的根
- 这个原型也有原型,是 null 下面再来一幅图,大家参照着小红小蓝,再去理解程序,最好自己动手画一画!
obj.__proto__
是 #409 号地址
#409是原型所在区域的地址
原型就是代表这块区域,是obj1的也是obj2的也是object的。
三、prototype属性的引入
考虑到以上这些情况,Brendan Eich 决定为构造函数设置一个 prototype 属性。
这个属性包含一个对象(以下简称"prototype对象"),所有实例对象需要共享的属性和方法,都放在这个对象里面;那些不需要共享的属性和方法,就放在构造函数里面。
实例对象一旦创建,将自动引用prototype对象的属性和方法。也就是说,实例对象的属性和方法,分成两种,一种是本地的,另一种是引用的。比如小红小兰自己独有的属性就是本地属性,共同属性就是引用的。
现在,中国人,黄皮肤,黑头发属性放在prototype对象里,是两个实例对象共享的。只要修改了prototype对象,就会同时影响到两个实例对象。
四、总结
由于所有的实例对象共享同一个prototype对象,那么从外界看起来,prototype对象就好像是实例对象的原型,而实例对象则好像"继承"了prototype对象一样。
这就是Javascript继承机制的设计思想。不知道我说清楚了没有,继承机制的具体应用方法,可以参考我写的系列文章: JS全解(四)new是干啥的?❤️
本文参考了知乎、CSDN、网道JavaScript 的一些知识,有描述不准确的地方还希望大多多家指正!!!