将 jQuery 与 ES6 中的类一起使用 [重复]答案

【问题标题】：Using jQuery with classes from ES6 [duplicate]将 jQuery 与 ES6 中的类一起使用 [重复]
【发布时间】：2015-06-08 11:38:22
【问题描述】：

我的新项目刚刚遇到了一个小问题。基本上，有一个帖子页面和一些来自后端的 cmets 作为页面的一部分。我要做的就是为这些提供一些 JavaScript 逻辑。提供了我所做的：

class Comment {
    constructor(comment) {
        console.log("Creating comment object...");
        $(comment).find(".vote").click(this.toggle_vote);
        $(comment).find(".action.reply").click(this.toggle_reply);
    }

    toggle_vote() {
        // Context here is `span.reply`, not Comment instance,
        // but I want to access class members
        if ($(this).is(".voted")) {
            $(this).removeClass("voted");
            return;
        }

        $(this).addClass("voted");
        $(this).siblings().first().removeClass("voted");
    }

    // ...
}

下面的问题在于 jQuery 回调样式。当我将类成员传递给 jQuery 回调时，在调用时，jQuery 会模拟其上下文，因此 this 是 span.reply，而不是 Comment 实例。关键是我希望能够到达实际的 Comment 实例。

免责声明：我根本不是前端人员，所以我可能需要一些严格的解释来解决这个问题，谢谢！

【问题讨论】：

这与使用 ES6 类语法无关。
顺便说一句，您的 toggle_vote 函数似乎确实认为 this 是 DOM 元素？
@Bergi 很好，它可以自动取款，但我希望它以另一种方式表现。我听说过 ES6 中的 "=>" 语法，它可以在这里工作吗？
可以，你可以用….click((e) => this.toggleReply(e.currentTarget))左右。

标签： javascript jquery ecmascript-6

【解决方案1】：

您可以使用 .bind 为函数定义 this-object

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

你的情况

.click(this.toggle_vote.bind(this))

【讨论】：

我可以用 ES6 "=>" 语法绑定它吗，比如：.click((event) => this.toggle_vote)？