Question

我开始在javascript中学习OOP并且遇到了这个问题。我有简单的对象：

ES6 class

当我跑步时，我得到：

decorators

因为function Notifications() { this.button = $('#dLabel'); this.wrapper = $('#notifications'); this.elements = []; } Notifications.prototype = { constructor: Notifications, fetch: function() { $.ajax({ method: "GET", url: '/notifications.json' }).done(function(data) { this.elements = data; this.refresh(); }); }, refresh: function() { console.log("REFRESH"); } } $(function() { var ns = new Notifications(); ns.fetch(); })函数中的Uncaught TypeError: this.refresh is not a function不是this实例吗？我该如何解决这个问题？

Answer 1

使用bind() method修复上下文：

Notifications.prototype = {
  constructor: Notifications,
  fetch: function() {
    $.ajax({
      method: "GET",
      url: '/notifications.json'
    }).done(function(data) {
      this.elements = data;
      this.refresh();
    }.bind(this)); // <------- Use bind(this)
  },
  refresh: function() {
    console.log("REFRESH");
  }
}

done()处理程序function(data) {...}作为简单的函数调用执行，其中this作为全局对象（Window）或undefined "strict mode" }。
Function.prototype.bind(newContent)将上下文修改为newContext。

This section更详细地介绍了this如何丢失以及如何防止这种情况。

在原型中调用函数

1 个答案: