js this 问题

class Animal {
    constructor(){
        console.log(this);
        this.type = 'animal'
    }
    says(say){
        setTimeout(function(){
            console.log(this);
            console.log(this.type + ' says ' + say)
        }, 1000)
    }
}

为什么一个this是Animal对象,一个this是window对象?

阅读 2.5k
5 个回答

这是JS中一个不好的地方: setTimeout的执行上下文是window对象而不是class Animal. 导致了setTimeout中的函数是基于全局作用域执行, 其中的this指向了window
可以这样解决(ES6):

setTimeout(() => {
    // you code...
    }, 1000)

setTimeout 里面 的匿名函数是作为函数调用的,而不是 对象的方法。。而作为函数调用的this 就是指向全局啊。。而不是setTimeout剥离你的上下文。。。里面就是个函数,不信你可以这么写。

 says(say){
        function test(){
            console.log(this);
            console.log(this.type + ' says ' + say)
        }
        test();//这个this 绝对也不是指向Animal对象
    }

一.

 says(say){
        var _this = this;
        setTimeout(function(){
            console.log(_this);
            console.log(_this.type + ' says ' + say)
        }, 1000)
    }

JS中函数内的上下文是由函数的调用者决定的,setTimeout的调用者是window,所以会log出window。这里如楼上所说,是可以使用箭头函数解决的,因为箭头函数的上下文是其所处环境决定的。

闭包,函数嵌套函数,可以访问函数中的局部变量

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题