面试题之arguments[0]()

题目

var length = 10;
function fn(){
    console.log(this.length)
}
var obj = {
    length: 5,
    method: function(fn) {
        arguments[0]()
    }
}
obj.method(fn)

// 这段代码中最终输出什么？
// fn 指向 this的指向是谁？

答疑

这里没有输出 5，也没有输出 10，反而输出了 1，有趣。这里 arguments 是javascript的一个内置对象，是一个类数组（就是长的比较像数组，可是欠缺一些数组的方法，能够用slice.call转换成数组），其存储的是函数的参数。也就是说，这里arguments[0]指代的就是你method函数的第一个参数：fn，因此arguments0的意思就是：fn()。不过这里有个疑问，为什么这里没有输出5呢？我method里面用this，不该该指向obj么，至少也会输出10呀，这个1是闹哪样？实际上，这个1就是arguments.length，也就是本函数参数的个数。为啥这里的this指向了arguments呢？由于在Javascript里，数组只不过使用数字作属性名的方法，也就是说：arguments0的意思，和arguments.0()的意思差很少（固然这么写是不容许的），你更能够这么理解：

arguments = {
    0: fn, //也就是 functon() {alert(this.length)} 
    1: 第二个参数, //没有 
    2: 第三个参数, //没有
    ..., 
    length: 1 //只有一个参数
}

因此这里 alert 出来的结果是 1 。

若是要输出 10 应该咋写呢？

var length = 10;
function fn(){
    console.log(this.length)
}
var obj = {
    length: 5,
    method: function(fn) {
        fn()
    }
}
obj.method(fn)

若是要输出 5 应该咋写呢？

var length = 10;
function fn(){
    console.log(this.length)
}
var obj = {
    length: 5,
    method: fn
}
obj.method()

或者

var length = 10;
function fn(){
    console.log(this.length)
}
var obj = {
    length: 5,
    method: function(fn) {
        fn.call(obj)
        // fn.call(this)
    }
}
obj.method(fn)

扩展

var length = 5
function fun(){
    console.log(this.length)
}
var arr = [fun]

fun()     // ？
arr[0]()  // ？

参考

https://www.zhihu.com/question/21466212