关于javascript:理解callapplybind区别和使用场景

37次阅读

共计 874 个字符,预计需要花费 3 分钟才能阅读完成。

共同点

三个办法都是用来从新定义 this 指向的,第一个参数都是 this 要指向的对象

不同点

a、call 函数能够有多个参数
b、apply 函数的第二个函数是数组,数组的每一项都是指标函数的参数
c、bind 函数返回的是一个函数,应用时须要调用触发
d、bind 函数的底层是 call 实现的

应用办法

call 的用法:
例如判断数据类型,个别用 Object.prototype.toString 联合 call 办法来进行判断:

var obj = {}
console.log(Object.prototype.toString.call(obj) === "[object Object]");

为什么须要应用 call 函数来判断?而不是间接应用 obj.toString() 呢?
因为 obj 对象可能重写 toString 办法

apply 的用法:
栗子 1: 例如咱们在应用 Math 函数获取最大最小值时能够这样应用Math.max(5,6,7,8,9), 这样能获取到最大值 9,然而如何去求一个数组中的最大值呢?

// 这样应用是行不通的
var arr = [5,6,7,8,9]
Math.max(arr)
// 只能这样应用
Math.max.apply(null, arr)

栗子 2: 两个数组 var arr1 = [1,2,3]; var arr2 = [2,3,4], 如何优雅的将 arr2 中的值追加到 arr1 中去呢?
这里能够应用 apply 函数,能够这样写:
Array.prototype.push.apply(arr1, arr2)

bind 用法:

this.num = 9; 
var mymodule = {
  num: 81,
  getNum: function() { return this.num;}
};

mymodule.getNum(); // 打印进去是 81

var getNum = mymodule.getNum;

getNum() // 这里打印进去是 9,因为 this 指向 window

var bindNumber = mymodule.getNum.bind(mymodule)
bindNumber() // 这里打印进去的是 81,利用 bind 将 this 指向了 mymodule 对象

正文完
 0