this指向问题

最新推荐文章于 2025-05-31 16:02:29 发布

周心

最新推荐文章于 2025-05-31 16:02:29 发布

阅读量87

点赞数

文章标签： javascript

本文链接：https://blog.youkuaiyun.com/weixin_44905572/article/details/118702976

版权

本文通过实例解析了JavaScript中箭头函数this指向的特殊性，强调了它与普通函数上下文的不同，并讨论了Vue3中this的处理。重点探讨了几个困扰开发者的问题，涉及对象方法、window对象和闭包中的this指向。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

个人觉得是：上级调用的对象

let user = {
  name:'zhouxin',
  fn:function(){
    console.log(this) //user调用的fn,所以指向user
    console.log(this.name) //zhouxin
  }
}
user.fn()

function getUser(){
  let name = 'zhouxin';
  console.log(this)  //window
  console.log(this.name) //undefined
}
getUser()

var o = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this); //b
            console.log(this.a); //12
        }
    }
}
o.b.fn();

var o = {
    a:10,
    b:{
        // a:12,
        fn:function(){
            console.log(this.a); //undefined
        }
    }
}
o.b.fn();

几个例子下来估计你已经悟了。

不过下面这个可是纠结死我了

var o = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this.a); //undefined
            console.log(this); //window
        }
    }
}
var j = o.b.fn;
j();

window.j(),没毛病，可不也是window.o.b.fn()吗？

箭头函数的this是定义是所处的环境，不是调用所处的环境，而上面是调用处的环境

Vue3木有this