如果您查看計算屬性名稱
您可以看到您可以在括號內放置一個表達式，這可能會導致以下構造 [(console.log(x),x)]返回x，但允許我們轉儲它之前保存的內容。
const a = {
[(console.log('log:', this.a + this.b), this.a + this.b)]: 'test'
}
// this.a is undefined and summing them is NaN
console.log(a.NaN) // 'test'
如果我們現在考慮下面
;(function () {
const a = {
[(console.log('log', this.a + this.b), this.a + this.b)]: 'top'
}
console.log(a.zz) // 'top'
}).call({ a: 'z', b: 'z' })
我們確實得到了一些 zztop。
我還沒有閱讀所有規范，但在某種程度上我們可能會依賴正在運行的執行上下文來確定this
第一種情況：全球環境
在后面：已綁定的函數{a: 'z', b: 'z'}
因為我們有點貪心：
window.a = 'z'
window.b = 'z'
const c = {
[(console.log('log', this.a + this.b), this.a + this.b)]: 'test'
}
console.log(c.zz) // 'test'
編輯：關于this函數中的。它與用于計算屬性名稱的表達式無關，并且過著它的生活this
const a = {
hello: 'top',
zz: function () { console.log(this.hello) } // top
}
a.zz()
// the first this is resolved as the global env
// the this in function is resolved as b
const b = {
hello: 'top',
[(console.log('the this.hello is undef', this.hello), 'zz')]: function () { console.log(this.hello) } // top. The caller is b.
}
b.zz()
// and some usual invocation where this is bound to a
const c = {
hello: true,
['zz']: function () { console.log(this.hello) } // top
}
a.hello = 'TOP'
c.zz.call(a) // TOP
