关于javascript this的困惑

Delete
  • 131

代码1:

var obj = {
    name:'xxx',
    getThis:function(){
        console.log(this)
    }
}
obj.getThis()

代码2:

var obj = {
    name:'xxx',
    getThis:()=>{
        console.log(this)
    }
}
obj.getThis()

代码1输出obj本身,代码2输出window

代码3:

function Foo(name){
    this.name = name
    this.getThis = function(){
        console.log(this)
    }
}
var f = new Foo('xxx')
f.getThis()

代码4:

function Foo(name){
    this.name = name
    this.getThis = ()=>{
        console.log(this)
    }
}
var f = new Foo('xxx')
f.getThis()

我不理解,为什么代码3与代码4输出的this都是f。代码4不是应该输出window吗?

回复
阅读 1.2k
3 个回答
✓ 已被采纳

3中f.getThis,方法的调用者是f,所以this指向f

const func = f.getThis;
func(); // return window or global

4中arrow function不维护this,它的this是Foo构造函数里的this,所以指向实例

const func = f.getThis()
func(); // return f

代码4的 this 绑定到对象 f 上了,() => 表达式是绑定到当前对象,所以输出的是 f

楼主,你这样记住吧,凡是用构造函数创建对象,无论用何种方式,this指向的永远都是声明的创建的对象变量,但是用“对象字变量”,this指向箭头函数和普通函数稍有区别

你知道吗?

宣传栏