Question

我正在尝试从Typescript中的5深嵌套函数调用函数，并且它无法看到外部函数。在setTimeout内运行console.log(this)会返回window对象。

export class SearchComponent implements OnInit {


lifeCycleFunc(){    //Function 1
    ...

    if() {                //Function 2
        ....

        var.do(item => {        //Function 3
            ....

            var.forEach(var => {      //Function 4
                ...

                setTimeout(function(){    //Function 5

                    this.searchFunc()        //this.searchForAssignments is not a function
                }
            })
        })
    }
}

searchFunc(){
    ...
}


}

Answer 1

this回调中的

setTimeout上下文将成为全局对象（window），但该代码应该SearchComponent类才能正常工作。要实现包括setTimeout回调在内的所有嵌套函数都应该是箭头函数来正确绑定this上下文：

export class SearchComponent implements OnInit {    
    lifeCycleFunc(){
        ...

        if(condition) {
            ...

            foo.do(bar => {
                ...

                bar.forEach(baz => {
                    ...

                    setTimeout(() => {  
                        this.searchFunc();
                    }, 0);
                });
           });
       }
    }

    searchFunc(){
      ...
    }
}

Answer 2

要回答您的问题以及关于使其成为箭头功能的评论，请执行以下操作：

setTimeout(() => {  
    this.searchFunc();
}, 0);

而不是：

setTimeout(function() {  
    this.searchFunc();
}, 0);

Answer 3

var.forEach(var => {    //Function 3
            ...

            this.searchFunc()     //TypeError: this.searchForAssignments is not a function
        }.bind(this))

this内的forEach引用是forEach函数。您需要将它绑定到该类的此引用。

打字稿 - 全局函数？

3 个答案: