浅谈JavaScript里面call() apply()和bind()的区别
在JavaScript中,this的指向是动态变化的,很可能在写代码的过程中,无意中改变了this的指向,故我们需要一种可以将this的指向固定的方法,于是就有了call() ,apply()和bind()这三个方法。
举个例子：
我们是想打印a里面的name,但是结果却输出了undefined,这是怎么回事呢?
如果我们直接执行a.fn()的话,是可以输出name值的,如:
直接执行a.fn()为什么可以输出想要的值？ 因为这里this的指向是指向a，那么为什么b的指向不指向a呢？因为this的指向在函数定义的时候确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象。
以上的这种直接调用a的方法虽然也可以达到我们的目的,但是有的时候我们不得不将这个对象保存到另一个变量中,因为JavaScript的函数存在[定义时上下文]和[运行时上下文]以及[上下文是可以改变的]这样的概念,而call和apply以及bind可以用来重新定义函数的执行环境,也就是this的指向,它们都是为了改变某个函数运行时的上下文而存在的.
如果想要变量b输出name的值,可通过以下三种方法:
1. call()
通过在call方法,给的第一个参数要把b添加到哪个环境中,也就是this会指向那个对象
Call方法除了第一个参数以外还可以添加多个参数,如下:
2. apply()
apply方法和call方法有些相似，它也可以改变this的指向
同样apply也可以有多个参数，但是不同的是，第二个参数必须是一个数组，如下：
注:如果call和apply的第一个参数写的是null，那么this指向的是window对象
3. bind()
bind方法和call、apply方法有些不同，但是它们都可以用来改变this的指向。
先说说他们的不同之处吧,如下:
我们发现代码没有被打印，没毛病，这就是bind和call、apply方法的不同，实际上bind方法返回的是一个修改过后的函数。如果想要打印出来name值,需要在后面加()，如下：
同样，bind也可以传递多个参数，它要传递的参数和call()一样，如下：
或者可以这样：
总结：
Call()和apply()以及bind()的相似点：
- 都是用来改变函数的this的指向
- 第一个参数都是this要指向的对象
- 都可以继续传递参数
Call()和apply()以及bind()的区别：
- Call()在第一个参数之后，后续所有的参数都是传入该函数的值。
- apply()只有两个参数，第一个参数是this要指向对象，第二个是数组，这个数组就是该函数的参数。
- bind()方法会返回执行上下文被改变的函数，而不会立即执行，前两者是立即执行函数，它的参数和call()相同。