1 回答

TA貢獻(xiàn)1830條經(jīng)驗(yàn) 獲得超3個(gè)贊
一種方法是動(dòng)態(tài)創(chuàng)建 的綁定版本并改用它:gameOn()
{
// ...
start() {
for (let coin of coins) {
this.moveCoin(coin);
}
if (this.boundGameOn === undefined) {
this.boundGameOn = this.gameOn.bind(this);
}
window.addEventListener("keydown", this.boundGameOn)
},
stop() {
window.removeEventListener("keydown", this.boundGameOn);
},
// ...
}
理想情況下,您會(huì)在構(gòu)造函數(shù)中執(zhí)行此操作。如果你有一個(gè)構(gòu)造函數(shù)而不是一個(gè)對(duì)象文本,你可以這樣做:
function GameObject () {
this.boundGameOn = this.gameOn.bind(this)
}
GameObject.prototype = {
// rest of code ..
}
事實(shí)上,在 React 應(yīng)用程序中,看到這種設(shè)計(jì)模式并不少見:
function GameObject () {
this.gameOn = this.gameOn.bind(this); // MAGIC!!
}
GameObject.prototype = {
// ...
start() {
for (let coin of coins) {
this.moveCoin(coin);
}
window.addEventListener("keydown", this.gameOn)
},
stop() {
window.removeEventListener("keydown", this.gameOn);
},
// ...
}
MAGIC 行確保內(nèi)部始終指向游戲?qū)ο?,因?yàn)槟谟闷渥陨淼慕壎ò姹靖采w它。thisgameOn()
這在ES6類語法中看起來稍微干凈一些(只是稍微有點(diǎn),我個(gè)人對(duì)這兩種語法都沒有偏好):
class GameObject {
constructor () {
this.gameOn = this.gameOn.bind(this); // MAGIC!!
}
// ...
start() {
for (let coin of coins) {
this.moveCoin(coin);
}
window.addEventListener("keydown", this.gameOn)
}
stop() {
window.removeEventListener("keydown", this.gameOn);
}
// ...
}
使用為ES7提出的實(shí)驗(yàn)性類屬性語法,它甚至更簡(jiǎn)單:你可以只使用箭頭函數(shù)(現(xiàn)在不要直接使用它,2020年中期,因?yàn)镾afari不支持這個(gè),但如果你使用Babel或Typescript,你可以編譯到ES6):
class GameObject {
// ...
start = () => {
for (let coin of coins) {
this.moveCoin(coin);
}
window.addEventListener("keydown", this.gameOn)
}
stop = () => {
window.removeEventListener("keydown", this.gameOn);
}
// ...
}
在本例中由箭頭函數(shù)綁定。this
添加回答
舉報(bào)