javascript - ionic angular app异步函数中 "this"的范围

Question

我正在尝试执行一个未找到的函数，除非我将对该函数的引用保存在一个单独的变量中:

   function updateCheck() {
            if (this.isNewVersionNeeded()) {
                var buildFunc = this.buildObject();
                this.updateBiography().then(function(){
                    buildFunc();
                })
            } 
        };

只有在执行 this.updateBiography(异步函数)之前保存它并通过我保存在(buildFunc)中的变量执行它时，buildObject 函数才会执行。以下不起作用:

           function updateCheck() {
                if (this.isNewVersionNeeded()) {
                    this.updateBiography().then(function(){
                        this.buildObject();
                    })
                } 
            };

我通过服务对象公开所有功能:

 var service = {
            all: all,
            updateBiography: updateBiography,
            get: get,
            updateCheck: updateCheck,
            isNewVersionNeeded:isNewVersionNeeded,
            buildObject:buildObject
        };
        return service;

当我在执行 buildFunc 之前记录“this”对象时，它会记录窗口/全局范围。为什么会这样，我应该如何处理？我不想将我所有的异步方法保存在一个单独的变量中只是为了记住它们。我应该如何处理这个问题，为什么它不起作用？

整个服务:

(function () {
    angular
        .module('biography.services', [])
        .factory('Biography', Biography);

    Biography.$inject = ['$http'];

    function Biography($http) {

        var biographyObject = { } ;

        var service = {
            all: all,
            updateBiography: updateBiography,
            get: get,
            updateCheck: updateCheck,
            isNewVersionNeeded:isNewVersionNeeded,
            buildObject:buildObject
        };
        return service;

        var self = this;
        function updateCheck() {
            if (this.isNewVersionNeeded()) {
                this.updateBiography().then(function(){
                    self.buildObject();
                })
            } 
        };

        function updateBiography() {
            return $http.get("Apicall adress")
                        .then(function (resp) {
                            window.localStorage.setItem('biography', resp.data);
                            window.localStorage.setItem('biographyTimeStamp', Date.now());
                        }, function (err) {
                            console.log('ERR', err);
                        });
        }

        function all() {       
            return biographyObject;
        }

        function get(name) {
            var biography = biographyObject;
            for (var i = 0; i < biography.length; i++) {
                if (biography[i].name === name) {
                    return biography[i];
                }
            }
            return null;
        }


        function buildObject() {
            var temp = JSON.parse(window.localStorage.getItem('biography'));
            biographyObject = temp;
        };

        function isNewVersionNeeded() {
            prevTimeStamp = window.localStorage.getItem('biographyTimeStamp');
            var timeDifference = (Date.now() - prevTimeStamp);
            timeDifference = 700000;
            if (timeDifference < 600000) {
                return false;
            }
            else {
                return true;
            }
        }
    }
})();

Answer 1

匿名函数的 this 的上下文(不同于函数作用域)是在稍后调用时确定的。

简单的规则是 - 点左边的任何内容，例如 myObj.doSomething() 允许 doSomething 访问 myObj 作为 这个。

function updateCheck() {
    if (this.isNewVersionNeeded()) {
        this.updateBiography().then(function() {

// whichever object has this anonymous function defined/invoked on it will become "this"

            this.buildObject(); 
        })
    }
};

---

因为你只是传递你的函数引用，你可以只使用这个

function updateCheck() {
    if (this.isNewVersionNeeded()) {
        this.updateBiography().then(this.buildObject);
    }
};

并且如果 this.buildObject 依赖于上下文(在内部使用 this 关键字)，那么您可以使用

function updateCheck() {
    if (this.isNewVersionNeeded()) {
        this.updateBiography().then(this.buildObject.bind(this));
    }
};

this 由调用该函数的任何上下文(对象)决定，并且看起来匿名函数或未通过对象引用的函数默认具有 window上下文。 bind 函数将 this 的所有实例替换为实际的对象引用，因此它不再是多用途的

---

same function invoked in different contexts (on different objects)

var obj = {
    a: function () {
        console.log(this);
    }
};
var aReference = obj.a;
aReference(); // logs window, because it's the default "this"
obj.a(); // logs obj