箭头函数中 的this指向

在javscript中,this 是在函数运行时自动生成的一个内部指针,它指向函数的调用者。

  箭头函数有些不同,它的this是继承而来, 默认指向在定义它时所处的对象(宿主对象),而不是执行时的对象。

var name = "window";
var test = {
    name:"demo",
    // 传统函数
    getName1: function(){
        console.log(this.name);  // demo
        var that = this;
        setTimeout(function(){
            console.log(this.name);  // window
            console.log(that.name);  // demo
        },500)
    },
 
    // 箭头函数-作为异步回调
    getName2:function(){
        setTimeout(()=>{
            console.log(this.name)  // demo
        },500)
    },
 
    // 箭头函数-作为直接执行的方法
    getName3:()=>{
        console.log(this.name)  // window
    }
};

如上getName3(),将箭头函数作为直接执行的方法来写时要特别小心,它的this会直接指向window。

我发现真是有趣

箭头函数this的指向就像人一出生下来就决定了的事情

出生时候爸爸所在的环境 = {
    你的姓: "张",
    出生:function() {
var 你的姓 = "3"
var 爸爸 = () => {
var 你的姓 = "2"
console.log(this.你的姓)} //这里面就是养你的爸爸所在的环境
return 爸爸
    }
}
出生时候爸爸所在的环境.出生()()
VM1229:7 张

由上面可以总结出this的指向是在定义它时所处的对象

箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this

猜你喜欢

转载自www.cnblogs.com/-constructor/p/11781295.html
今日推荐