JS系列总结笔记——5.深入理解call、apply、bind方法

时间:2022-12-31 16:01:16
1. call方法的作用

说明:在js中所有的函数都是Function的实例,而且对于Function来说,它的原型即Function.prototype中含有很多东西,其中call,apply和bind方法就是Function原型中的方法,所以根据原型的规则,所有的函数都可以使用原型中属性和方法,所以来说,对于所有的函数都可以使用call、apply、bind方法。
作用:而在JavaScript中,经常会有一个对象需要使用一个方法,但是该对象或者该对象的原型上并没有该方法,于是call、apply、bind方法就派上用场了。
JS中的this指向一般是看 “.” 前面是谁,this就是谁。call、apply、bind一般用来改变函数的指向,并将其this执行。下面看例子。

 function show(attr){  
   console.log(this[attr]);  
 }  
 var person={  
     name:"aa",  
     age:14  
 };  
 show.call(person,"name");  // 输出 aa

apply 方法和bind方法类似。


2. 实例
function fn1(){console.log(1);}
function fn2(){console.log(2);}

fn1.call(fn2);  // 输出 1
fn1.call.call(fn2);  // 输出2

解释:
fn1.call(fn2)输出1很好理解,虽然call改变了fn1中的this,但是输出结果中并没有this,因此结果是1;
fn1.call.call(fn2) 首先执行的是第二个call方法,该call方法的thisfn1.call,因此首先将fn1.call函数中的this改为fn2。随后执行的是fn1.call的this,即为fn2执行。


3. 参数
  • call 参数为(thisObj,argv1,argv2...)
    当第一个参数是nullundefined或为空时,call方法的this中的thiswindow。严格模式下,参数是啥this就是啥。

  • apply参数为(thisObj,[argv1,argv2...])
    其他与call相同;

  • bind方法参数(thisObj,argv1,argv2...)
    该方法在IE6-8下不兼容,且该方法只绑定this,不执行函数。


4.应用

求数组的最值:利用apply传参时自动将数组参数转化为值。

var arr=[1,2,3,4,5,6,7];

Math.min.apply(null, arr);
Math.max.apply(null, arr);