javascript - 从传递到构造函数的函数访问 javascript 对象的属性

Question

下面的代码不起作用，因为此时函数被调用 this=window.我原本期待 this =controller.actions.project，但后来了解了更多关于 this 关键字如何工作的信息，现在明白为什么情况并非如此。

损坏

controller.actions = {
        project: new TableauAction("Project",
            function () {
                $http.get('/reports/projects/').then(function (response) {
                     this.options = response.data;
                });
            }};

下面解决了问题，但是相当不优雅

有效

 controller.actions = {
        project: new TableauAction("Project",
            function () {
                var self = controller.actions.project;
                $http.get('/reports/projects/').then(function (response) {
                     self.options = response.data;
                });
            }};

TableauAction 对象:

function TableauAction(name, onChange) {
this.name = name;
this.onChange = onChange;}

我的问题是是否有一种更优雅的方法来从传递到其构造函数的函数访问对象的属性？

Answer 1

将“this”上下文添加到您的 onChange 回调中。

function TableauAction(name, onChange) {
  this.name = name;
  this.onChange = onChange;
  //add this context to your onChange
  this.onChange.bind(this);
}

然后将以下内容更改为:

controller.actions = {
        project: new TableauAction("Project",
            function () {
                //"this" refers to TableauAction instance now
                var $this = this;
                $http.get('/reports/projects/').then(function (response) {
                     //this refers to $http callback response..
                     $this.options = response.data;
                });
            }};
}