bind() call() apply()总结

Posted emma-zhao

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了bind() call() apply()总结相关的知识,希望对你有一定的参考价值。

相同:

bind() call() apply()三者都是改变this指向的

不同:

1.call()和apply()可以看作是某个对象的方法,通过调用方法的形式,间接的调用函数.

bind()就是将某个函数绑定到某个对象上.

2.call()和apply()是立即调用,

而bind()是返回对应的函数便于稍后调用,而不是直接执行函数

详解:

call()和apply()第一个参数都是this要指向的对象,

call() 第二个参数传入的是参数列表,参数可以是任意类型,当第一个参数为null,undefined时,默认指向window

obj1.call(obj2,a,b);
//等价于
if(obj2!==null){
obj1.this=obj2;
}else{
obj1.this=window;
}
obj1(a,b);

apply() 第二个参数传入的是参数数组

apply()其他用法:

原理:apply()的特性可以将数组转化为参数列表

(1).Math.max() 函数返回一组数中的最大值,现在可以通过apply()实现得到数组中最大的一项

var arr = [1,2,3];

Math.max.apply(0,arr)或者Math.max.apply(null,arr)

同理Math.min()

(2).push方法没有提供push数组 可以使用apply()解决

var arr1 = [1,2,3,4];

var arr2 = [5,6,7];

[].push.apply(arr1,arr2)

arr1调用push方法,参数是通过apply将数组转换为列表的集合

arr1 现在就是 [1,2,3,4,5,6,7]; push则返回arr1的长度

bind()

和call()相似,第一个参数是this的指向,第二个参数接收参数列表.

区别在于bind方法返回值是函数,以及bind接收的参数列表的使用.

function fn (a,b,c){

  console.log(a,b,c)

}

var fn1 = fn.bind(null,‘hello‘);

fn1(‘A‘,‘B‘,‘C‘)

 

特别注意:

在ES6的箭头函数下,call()和apply()将失效,对于箭头函数来说

  1. 箭头函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象.所以不需要类似于 var _this=this这种写法;
  2. 箭头函数不可以当作构造函数,也就是说不可以使用new;
  3. 箭头函数不可以使用arguments对象,该对象在函数体内不存在.如果要用,可以使用Rest参数代替;
  4. 不可以使用yield命令,因此箭头函数不能够用作Generator函数;

 

以上是关于bind() call() apply()总结的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript中call,apply,bind方法的总结

call,apply,bind方法的总结

JavaScript中call,apply,bind方法的总结

JS中call,apply,bind方法的总结

js学习总结----call和apply和bind的区别

js中的call apply bind简单总结