前言
call/apply的核心理念就是借用方法。
这话乍一听上去，感觉有点云里雾里。讲一个生活中的实例来描述一下：
老邓和老王是邻居，老邓家有火锅，老王家有烧烤架。老王家很少吃火锅，但突然有一天想吃火锅，他就可以去老邓家借用火锅，这样老王家不仅吃上了火锅，还没花买锅的钱。同样如果有一天老邓家想吃烧烤，也可以去老王家借烧烤架。
call/apply做的便是类似的事，A对象上实现了一个方法，B对象由于一些需求，也需要调用同样的方法，最优的方法肯定是B直接去调用A对象的方法，自身无需扩展。
基本介绍
语法
fn.call(thisArg, arg1, arg2,...) fn.apply(thisArg, [arg1, arg2,...]) 复制代码
参数
thisArg(可选)：
fn函数的this指向thisArgthisArg传入null，undefined：非严格模式下：fn函数this->window；严格模式：this->undefined- 值为原始值(数字，字符串，布尔)时，this指向包装类
arg1,arg2(可选): 传给fn的参数
- apply传递的第二个参数为数组
作用
改变this指向
常见用法
判断数据类型
typeof方法只返回七种值：string、number、boolean、undefined、object、function、symbol。使用typeof是无法区分array和普通对象的。
arr = [] typeof(arr) // "object" obj = {} typeof(obj) // "object" 复制代码
Object.prototype.toString方法可以准确判断所有的类型，Array、String等都重写了该方法，因此就需要借助call/apply来调用Object.ptototype上的方法。
// 通过返回值的不同，就可以区分开对象与数组 Object.prototype.toString.call(arr) // "[object Array]" Object.prototype.toString.call(obj) // "[object Object]" 复制代码
类数组调用数组的方法
ES6未发布之前，没有Array.from方法可以将类数组转为数组，需要借助数组的slice方法将类数组转化为数组。
Array.prototype.slice.call(arguments) [].slice.call(arguments) 复制代码
当然别的数组方法也可以类似借用，例如push方法：
var arraylike = { 0: 1, length: 1 } Array.prototype.push.call(arrlike, 1) // {0: 1, 1: 2, length: 2} 复制代码
apply求数组的最大值与最小值
JavaScript中没有给数组提供类似max和min函数，只提供了Math.max/min，用于求多个数的最值，可以借助apply方法，直接传递数组给Math.max/min
const arr = [1,10,11,33,4,52,17] Math.max.apply(null, arr) Math.min.apply(null, arr) 复制代码
手撕call
初步模拟
首先看一个简单例子，分析一下call函数执行过程：
var obj = { value: 1 } function fun() { console.log(this.value) } fun.call(obj) // 1 复制代码
可见call函数调用执行了两部：
call改变了this指向，将this->objfun函数执行
那该如何模拟上面的效果那？
fun的this指向obj，说明func的执行方式为obj.func形式，因此在obj上定义函数fun，再执行obj.fun()即可。
所以call的模拟思想为下面三步：
- 将函数
fn设为thisArg的对象的方法 - 执行
thisArg.fn - 删除该函数
Function.prototype.myCall = function (thisArg) { // this为调用myCall的函数 thisArg.func = this; thisArg.func(); delete(thisArg.func); } 复制代码
完善
上面实现了call的初步模拟，还有几个地方有待解决：
- 未传入
thisArg参数：当未传入thisArg或传入null时，函数的this->window
thisArg = thisArg || window 复制代码
- 传入
arg1，arg2等参数时：ES6可以通过rest参数来实现，ES6以前可以通过遍历arguments来实现
// ES5 const args = [] for (let i = 1; i<arguments.length; i++) { args.push('argumens['+ i + ']') } eval('thisArg.func(' + args +')') 复制代码
eval()函数计算JavaScript字符串，并把它作为脚本代码来执行。array在与字符串相加时，会调用array.toString方法([1,2,3].toString() // "1,2,3")。
- 函数可以拥有返回值
举个例子：
const obj = { value: 1 } function func(name, age) { return { name, age, value: this.value } } func.call(obj, 'zcxiaobao', 24) // { // age: 24, // name: "zcxiaobao", // value: 1, // } 复制代码
这很好解决，只需将eval执行之后的结果返回即可。
接着我们来看一下完整版的代码：
Function.prototype.myCall = function (thisArg) { thisArg = thisArg || window; thisArg.func = this; const args = [] for (let i = 1; i<arguments.length; i++) { args.push('arguments['+ i + ']') } const result = eval('thisArg.func(' + args +')') delete thisArg.func; return result; } 复制代码
使用ES6语法进行模拟代码会简单很多
Function.prototype.myCall = function (thisArg, ...args) { thisArg = thisArg || window; thisArg.func = this; args = args || [] const result = thisArg.func(..args) delete thisArg.func; return result; } 复制代码
手撕apply
apply的代码实现与call类似，这不做过多赘述。
Function.prototype.myApply = function (thisArg, arr) { thisArg = thisArg || window; thisArg.func = this; const args = [] for (let i = 0; i<arr.length; i++) { args.push('arr['+ i + ']') } const result = eval('thisArg.func(' + args +')') delete thisArg.func; return result; }
