                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript深入浅出

bind 方法模拟时的arguments

我有些不太理解两个 arguments 的变化，

demo：

function foo(x,y,z){
  this.b = 100;
  return this.a+x+y+z;
}

var func = foo.bind({a:1},20);
func(3,4);

这个时候对于截图右边实现bind 模拟的代码而言，

var aArgs = Array.prototype.slice.call(arguments,1);  //此时的arguments[0]->{a:1}
                                                     //arguments[1]->20

而fBound 的匿名函数中

aArgs.concat(Array.propotype.slice.call(arguments))  //此时的arguments[0]->3
                                                    //arguments[1]->4

我感觉这样理解才是对的，这样 concat 之后返回的是 [20,3,4]

但是我不太明白fBound 的匿名函数中的 arguments 是何时指向函数调用的

16:39

Issa_Tan

2015-05-17

源自：JavaScript深入浅出 6-4

关注问题我要回答

2311

操作

收起

2 回答

Bosn
2015-06-05

非常认真的总结，很不错。加油哦。有问题可以微博艾特我@Bosn

0 回复有任何疑惑可以回复我~

收起回答

Issa_Tan 提问者
2015-05-19

额，自己犯傻了！！

自问自答之前先重申一下：标识符 arguments 是指向【实参】对象的引用。

也就是说，必须【在函数调用，传入了实参时，才有 arguments 对象】。

demo：

function foo(x,y,z){
  this.b = 100;
  return this.a+x+y+z;
}
 
var func = foo.mybind({a:1},20);  //因为 .bind()方法已存在，为了断点调试，改为 .mybind() 方法
func(3,4);

其中，

var func = foo.mybind({a:1},20);   // 此时全部实参为 [{a:1},20]

在Chrome 的控制台下模拟了一下，注意两点：

此时call stack（红色框）里面是第33 行调用 .mybind() 方法调用了第14行
第 20 行，也就是最后返回的函数的 arguments（蓝色框）也是[{a:1},20]，但此时这个函数【没有调用】，没有执行也就没有输出效果。

.mybind() 返回一个函数，保存在 func 里面，现在 func 里面是 .bind() 方法返回的函数，里面的内容也就是这一段，

当调用 func 函数，或者说是在调用 .mybind() 方法的返回值时，

func(3,4);  // 此时实参为 [3,4]

此时在Chrome 中断点，可以看到

call stack（红色框）中第 34 行， func(3,4) 调用的是 fBound 方法，也就是 18-19 行的代码
此时整个 Local 的 arguments（蓝色框）都是[3,4] ，即使是被调用的函数外部（即第14行）的 arguments 也是[3,4]
```
return fToBind.apply();
```
此时实际上是在间接调用 foo() 函数，其参数分别为 oThis 和 aArgs.concat(Array.prototype.slice.call(arguments))
闭包（紫色框）中可以看到 oThis 和 aArgs 仍然存在