学了 JavaScript 对象后,我终于理解了什么叫“引用”和“原型链”

0 阅读2分钟

从零开始理解 JavaScript 的对象(Object)——今天终于看懂了原型链

刚开始学 JavaScript 的时候,我一直觉得:

let user = { name: "Tom" }

这种代码很抽象。

因为以前接触编程比较少,我会疑惑:

  • 为什么花括号里能直接写东西?
  • 为什么有时候用 . 读取?
  • 为什么对象还能互相嵌套?
  • 原型链到底是什么?

今天认真学完 JavaScript 的对象之后,我第一次感觉:

JS 的很多东西开始串起来了。

————————————————————

一、对象到底是什么?

今天最大的理解:

对象其实就是“装数据的盒子”。

例如:

let user = { name: "方磊", age: 21 }

这里:

  • name
  • age

这些叫:

属性(property)

对象本质上就是:

属性名 -> 属性值

这样的键值对集合。

以前总觉得对象很高级。

现在发现:

其实它只是用来描述现实世界的信息。

————————————————————

二、我终于理解了“对象嵌套”

今天看到:

let flight = { departure: { city: "Sydney" } }

现在终于能理解成:

flight └── departure └── city

也就是说:

对象里面还能继续放对象。

这个思想其实特别重要。

因为现代前端的数据几乎全是这种结构。

————————————————————

三、点语法和中括号到底有什么区别?

之前一直是死记:

user.name

和:

user["name"]

都能读取属性。

今天终于理解:

点语法适合普通属性名。

中括号适合:

  • 特殊名字
  • 动态名字

比如:

user["first-name"]

因为:

first-name

JS 会当成减法。

————————————————————

四、原来对象赋值不是复制

今天一个特别重要的知识点:

let x = user

不是复制对象。

而是:

两个变量同时指向同一个对象。

所以:

x.name = "方磊"

会导致:

user.name

也一起变化。

今天才真正意识到:

JS 的对象很多时候操作的是“引用”。

————————————————————

五、今天最难的:原型链

这一部分我看了很久。

后来终于理解成:

如果当前对象没有某个属性:

对象自己没有 ↓ 去原型里找 ↓ 原型还没有 ↓ 继续往上找

这就是:

原型链(Prototype Chain)

虽然现在还没有完全吃透,但已经比以前清楚很多了。

————————————————————

六、今天这一章给我的感觉

以前学 JavaScript:

更像在背语法。

今天第一次开始有一种:

“理解语言设计思想”

的感觉。

尤其是:

  • 引用
  • 原型
  • 对象嵌套

这些内容。

感觉已经开始接触 JS 真正底层的逻辑了。

————————————————————

最后

今天最大的收获:

JavaScript 的对象不是单纯的数据结构。

它更像:

用代码模拟现实世界信息的一种方式。

后面准备继续深入:

  • 原型链
  • this
  • 函数对象
  • 作用域

慢慢把 JavaScript 的底层逻辑补起来。