javascript - 使用 Array brackets notation 时在 javascript 中发生了什么

Question

我通常发现 javascript 是透明的，因为只有很少的黑框会发生“魔法”，你应该接受并换个 Angular 看，但是我还没有找到数组括号 [] 符号实际上在幕后工作。

let arr = [4, 5, 6, 7]
console.log(arr[3]) // <- How does this work?

javascript 正在做什么来访问索引 3 处的项目。它是否在内部调用 Array.prototype 上的某些方法？

对于对象，[] 是属性访问器的快捷方式。

let obj = {
  a: 'hello',
  b: 'world'
}
obj['a'] === obj.a // true

那么数组只是一个具有一长串基于整数的属性的对象吗？

let objArray = {
   0: 'hello',
   1: 'world'
}
let realArray = ['hello', 'world']

objArray[0] === 'hello' // true
realArray[0] === 'hello' // true

objArray.0 // SyntaxError: Unexpected number
realArray.0 // SyntaxError: Unexpected number

我看过很多很多在线讨论，所有讨论都得出这样的结论，即您不能重载括号表示法来真正子类化一个数组，但我从来没有看到任何解释，说明在允许数组工作的幕后发生了什么魔法它的方式。

明显的后续问题是是否有任何方法可以拦截括号表示法访问以定义您自己的行为，但我想我已经知道答案了。

Answer 1

您可能需要查看实现代码才能准确了解发生了什么，但基本思想是数组实际上位于对象之上。

这是倒退的:

With an object, the [] is a shortcut for a property accessor.

括号表示法更为基础。因此，obj['foo'] 和 obj.foo 的工作方式相同，但是 obj['foo & bar'] 没有等效项>，这是完全合法的，如果 obj 有一个名为 "foo & bar" 的键，它将返回一个值。

Is an array then just an object with a long list of integer based properties?

不完全是，但你离得不远了。数组是具有 Array 原型(prototype)的对象，并且有一点额外的魔法可以在添加新键时设置 length 属性，或者在 length 时删除键 已设置。

不，您不能为了自己的目的而覆盖 [] 运算符。