一直没看懂Function.call() apply() bind(),今天研究了下,大概明白了。但是详细的还是不明白。
先讲讲已经明白的:
作用:
劫持某个对象,使原先的方法fun中可以调用劫持对象的方法和属性;可以直接使用param1,param2...
使用方法:
fun.call(劫持的对象,param1,param2,param3,...);
fun.apply(劫持的对象,[param1,param2,param3,...]);
fun.bind(劫持的对象,[param1,param2,param3,...])();
三个方法的作用是一样的。唯一的区别就是参数的传递形式不一样。第一个参数劫持的对象是fun方法里面的this要指向的地方,必填。其他的参数非必填。注意bind后面有一个括号
代码示例:
var objLi = {
name:'小李子obj',
age: 30,
myFun:function(one,two){
// console.log(this,'myFun里的this 仅指objLi');
console.log('this.name : '+this.name+' this.age年龄:'+this.age,' one参数is ',one,' 参数two是 ',two);
}
}
console.log(objLi.age,'====objLi age');
objLi.myFun('one','two');
var db={ name:'小甜甜', age:20 };
console.log('fun call apply bind无参数 ↓↓↓↓↓↓↓↓↓↓')
objLi.myFun.call(db);
objLi.myFun.apply(db);
objLi.myFun.bind(db)();
console.log('fun call apply bind都有参数 ↓↓↓↓↓↓↓↓↓↓')
objLi.myFun.call(db,'callOne','callTwo');
objLi.myFun.apply(db,['applyOne','applyTwo']);
objLi.myFun.bind(db,['bindOne','bindTwo'])();
经典案例 Math.max.apply
var tmpArray = [1,2,3,4,5,3,2,1];
var tmpMax = Math.max(...tmpArray);
console.log('最大值是 ',tmpMax); //最大值是 5
var tmpMaxApply = Math.max.apply(null,tmpArray); //这里的null也可以写成Math
console.log('最大apply值是 ',tmpMaxApply); //最大apply值是 5
关于Math.max(...tmpArray),是最新的扩展语句
spread operator
案例:数组push
上图中array使用apply方法,意思就是:
在push方法中,this指向了arr1,向arr1中添加arr2中的值