求助：在Promise回调中正确访问JavaScript类的this指向

这是个非常典型的JavaScript上下文绑定问题，我给你几个实用的解决方案，其中前两种完全符合你不想用预先定义变量的需求：

1. 使用ES6箭头函数（最简洁推荐） #

箭头函数的核心特性就是不会创建独立的this上下文，它会直接继承外层作用域的this——也就是我们需要的className实例。直接把done里的普通函数替换成箭头函数就行：

className.prototype.requestData = function (start, end) {
  client.server.functionName(parameters)
    .done((msg) => {
      if (msg) {
        this.process(msg); // 现在this完美指向className实例了！
      }
    })
    .fail(function (error) {
      console.log('failed: ' + error);
    });
}

2. 使用bind()方法显式绑定上下文 #

如果需要兼容ES6之前的旧环境，可以用Function.prototype.bind()把回调函数的this强制绑定到外层的className实例上：

className.prototype.requestData = function (start, end) {
  client.server.functionName(parameters)
    .done(function (msg) {
      if (msg) {
        this.process(msg); // this现在指向className实例
      }
    }.bind(this)) // 关键：把外层的this绑定给这个回调函数
    .fail(function (error) {
      console.log('failed: ' + error);
    });
}

补充：传统的“保存this到变量”方案（虽非你首选，但可了解） #

在ES6普及之前，开发者常用的方法是把外层的this存到一个变量里（比如self、that），再在回调里用这个变量访问实例：

className.prototype.requestData = function (start, end) {
  var self = this; // 保存className实例的this
  client.server.functionName(parameters)
    .done(function (msg) {
      if (msg) {
        self.process(msg); // 用self访问实例的process方法
      }
    })
    .fail(function (error) {
      console.log('failed: ' + error);
    });
}

这个方法虽然有效，但需要额外定义变量，所以你可以优先选择前两种方案~

内容的提问来源于stack exchange，提问作者Chris