为什么这个代码指向窗口对象?

2022-01-21 00:00:00 arguments javascript this

我的代码是:

var length = 20;
function fn(){
    console.log(this.length);
}

var o = {
    length:10,
    e:function (fn){
       fn();
       arguments[0]();
    }
}

o.e(fn);

输出是20,1，谁能告诉我为什么?

the output is 20,1,who can tell me why?

推荐答案

当 this 关键字出现在函数内部时，其值取决于函数的调用方式.

When the this keyword occurs inside a function, its value depends on how the function is called.

在您的情况下，调用 fn() 时未提供 this 值，因此默认值为 window.使用 arguments[0]()，上下文是 arguments 对象，其长度为 1.

In your case, fn() is called without providing the a this value, so the default value is window. With arguments[0](), the context is the arguments object, whose length is 1.

关键是函数在哪里被调用并不重要，重要的是函数如何被调用.

The point is it does not matter where the function is called, but it matters how the function is called.

var length = 20;
function fn(){
    console.log(this.length);
}

var o = {
    length:10,
    e:function (fn){
       fn(); // this will be the window.
       arguments[0](); // this will be arguments object.
    }
}

o.e(fn);

此外，如果您希望 this 成为对象 o，您可以使用 call 或 apply, 或者先绑定一个对象.

Further more, if you want this to be the object o, you could use call or apply, or bind an object first.

var length = 20;
function fn(){
    console.log(this.length);
}

var o = {
    length:10,
    e:function (fn){
       var fn2 = fn.bind(this);
       fn.call(this); // this in fn will be the object o.
       fn.apply(this); // this in fn will be the object o.
       fn2(); // this also will be the object o.
    }
}

o.e(fn);

相关文章