Javascript 附加到未定义事件的原型方法

我是Javascript中OOP的新手，我希望我的Slider对象具有自己的属性和方法。在我用我的方法slideNextImage添加Eventlistener之前，它可以正常工作。一旦触发此方法，该方法中的每个属性都是未定义的。如果我在没有附加任何事件的情况下启动该方法，则效果良好

function Slider(photos, currentPhoto){ //Constructor
    this.photos = photos;
    this.currentPhoto = currentPhoto;
}

Slider.prototype.slideNextImage = function () {
    document.getElementById("slider").style.backgroundImage = "url(" + this.photos[this.currentPhoto] + ")";
    console.log("La foto actual es la " + this.currentPhoto + " y en el almacen hay " + this.photos.length);
}

var photos = ["../imagenes/images/wallpaper_5.jpg", "../imagenes/images/wallpaper_4.jpg", "../imagenes/images/wallpaper_3.jpg", "../imagenes/images/wallpaper_2.jpg", "../imagenes/images/wallpaper_1.jpg"];

var slider = new Slider(photos, 0);

document.getElementById("next").addEventListener("click", slider.slideNextImage);

---

提前谢谢。

这是因为在本例中，“this”未绑定到您真正想要的对象。（在您的情况下，“this”将绑定到触发事件的元素）

解决此问题的一种方法是通过将addEventListener行更改为以下值，将“this”显式绑定到滑块：

document.getElementById("next").addEventListener("click", Slider.prototype.slideNextImage.bind(slider));

---

这是因为在这种情况下，“this”没有绑定到您真正想要的对象。（在您的情况下，“this”将绑定到触发事件的元素）

解决此问题的一种方法是通过将addEventListener行更改为以下值，将“this”显式绑定到滑块：

document.getElementById("next").addEventListener("click", Slider.prototype.slideNextImage.bind(slider));

---

当作为事件处理程序调用时，您的方法将丢失其上下文（

此

不再是滑块对象）。您有几个选项，最简单的是使用

Function.prototype.bind

：

slider.slideNextImage.bind(slider);

---

当作为事件处理程序调用时，您的方法将丢失其上下文（

此

不再是滑块对象）。您有几个选项，最简单的是使用

Function.prototype.bind

：

slider.slideNextImage.bind(slider);

---

哎呀，你比我快多了。非常感谢你，现在它工作得很好。对于全局对象，你是指接收事件的对象吗？是的，我不好，我刚刚修复了它。不客气：）现在它工作了，我完全理解它。谢谢你的解释。哎呀，你比我快。非常感谢你，现在它工作得很好。对于全局对象，你是指接收事件的对象吗？是的，我不好，我刚刚修复了它。不客气：）现在它工作了，我完全理解它。谢谢你的解释。