Question

我试图通过转换现有应用来了解ES6和Angular。不出所料，挑战是this！

let _$localStorage来自（Injected dependencies not accessible in class methods for AngularJS），但已经有人建议说这不是一个好方法。

我试图实现的下一件事有同样的问题，即如何在一个类中使用全局变量。

欢迎提出建议

let _$localStorage;
//^^^^^^^^^^^^^^^^^
class MainSvc {
    constructor($http, $localStorage) {
        this.$http = $http;
        _$localStorage = $localStorage;

        this.data = {};
      //^^^^^^^^
        this.production = (location.host === "afbackend.herokuapp.com");
        this.baseUrl = location.protocol + '//' + location.host;

        console.log('MainSvc');
    }

    login(data, success, error) {
        this.$http.post(this.baseUrl + '/auth', data)
        .success(function(res)  {
            console.log("Login succeeded, token :", res.token);
            _$localStorage.token = res.token;
            this.data.user = getUserFromToken(res.token);
          //^^^^^^^^^^^^^^
            console.log(m);
            // success();
        })
        // .error(error);
    }
}

Answer 1

'这个'的概念并没有随着es6而改变。

与此相关的唯一不同之处是使用big arrow functions。

使用大箭头，'this'从调用函数传递给被调用函数（与将函数绑定到此函数相同）。

所以你仍然可以在课堂上自由使用它，但请记住，当你使用不是大箭头的常规匿名函数时，如果你想访问它，你还需要传递'this'。

所以要纠正你的代码，你应该写。

login(data, success, error) {
     var self = this;
        this.$http.post(this.baseUrl + '/auth', data)
        .success(function(res)  {
            console.log("Login succeeded, token :", res.token);
            _$localStorage.token = res.token;
            self.data.user = getUserFromToken(res.token);
          //^^^^^^^^^^^^^^
            console.log(m);
            // success();
        })
        // .error(error);
    }

使用大箭头也可以表示为：

    login(data, success, error) {
        this.$http.post(this.baseUrl + '/auth', data)
        .success((res) => { //Big arrow
            console.log("Login succeeded, token :", res.token);
            _$localStorage.token = res.token;
            this.data.user = getUserFromToken(res.token);
          //^^^^^^^^^^^^^^
            console.log(m);
            // success();
        })
        // .error(error);
    }

ES6：相当于_this / self

1 个答案: