document.addEventListener("DOMContentLoaded", () => {
document.querySelector('start'),addEventListener('click', () =>{
var car = new Car('Audi');
document.addEventListener('keyup', e=>{
car.printName();
})
})
})
class Car{
constructor(name){
this.name = name
}
printName(){
console.log(this.name)
}
}
我正在尝试使用JavaScript OOP创建一个简单的游戏。在DOM加载并且玩家点击“开始”按钮之后，通过传递对象的name属性来创建一个新的Car对象。为简单起见，该类中目前唯一的方法是打印的'printName'。
问题是，即使我每次创建一个新的对象，只要玩家按下开始按钮，游戏就应该重置，先前的对象都会保留在内存中。
注意，在上面的代码中，每当玩家两次按下“开始”按钮并按下任意键时，都会为新对象和旧对象调用“ printName”方法。我该如何解决这个问题？
您可以通过在keyup事件外部添加事件来解决此问题click，以便click事件停止向keyup堆栈中添加多个事件侦听器，例如：
document.addEventListener("DOMContentLoaded", () => {
var car;
document.querySelector('start'), addEventListener('click', () => {
car = new Car('Audi');
})
var handleKeyup = () => car && car.printName();
document.addEventListener('keyup', handleKeyup, false)
})
class Car {
constructor(name) {
this.name = name
}
printName() {
console.log(this.name)
}
}<button class="start">Start</button>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句