原生实现call、apply方法

大学的时候，一位大佬跟我说，让我用原生写一下call、apply方法，我没写。直到现在。。。。拖延症真的不是吹的。

call

先来看官方解释：

call()方法调用一个函数，其具有一个指定的this值和分别地提供的参数（参数的列表）。

也就是说使用call方法，你可以指定被调用函数的this值，并且给他传参数。

接下来我们自己实现一个call方法。

1、模拟如何指定this的值

先来看一段代码

function func() {
    console.log(this.value)
}
var obj = {
    value: 233
}
func.call(obj); //233

就是在调用func的时候，我们设置了当前this为obj，所以输出的this.value 就是233。不多说了。

试想一下，call方法是要改变this的值，我们可以给obj对象加一个属性fn，把func函数赋值给它，调用obj.fn，this自然就指向对象obj了，也起到了调用func函数的作用。所以我们可以这么实现：
1. 给对象obj添加fn属性，并赋值func函数
2、调用它–> obj.fn()
3、delete obj.fn

function func() {
    console.log(this.value)
}
var obj = {
    value: 233
}
Function.prototype.mycall = function(obj) {

    obj.fn = this; //这里的this就是调用mycall的func函数
    obj.fn();
    delete.fn;
}
func.mycall(obj); //233

ok,现在我们已经实现了如何指定的this的值。

2、实现可传参

Function.prototype.mycall = function(obj) {

    var args = [];
    for(var i = 1, len = arguments.length; i < len; i++) {
       args.push('arguments[' + i + ']');
    }
    obj.fn = this;
    eval('obj.fn('+ args +')’);
    delete obj.fn;
}

多说一句，我们拿到的args数组其实是[‘arguments[0]’, ‘arguments[1]’,…]这样子的，如果我们直接去拿arguments[0]的值的话，你测试一下传一个字符串参数，像这样，func.mycall(obj, ‘dd’);就会报错，告诉你dd is not defined。因为eval会把字符串解析成一个变量。

这里遇到了一个问题，如何给一个函数传递不定参？或者说怎么把不定长的数组转换成多个参数传递给函数？？
三种办法： eval、apply和es6 的解构语法

1、eval('obj.fn('+ args +')');
2、obj.fn.apply(obj, args); 
3、obj.fn(…args);//es6解构语法

3、完善小细节

到这里，我们基本已经实现了call方法的功能，还有两个点需要注意：
– 如果第一个参数为null，this指向window
– 函数调用是有返回值的

呈上终极代码。

Function.prototype.mycall = function(obj) {

    var args = [];
    for(var i = 1, len = arguments.length; i < len; i++) {
       args.push('arguments[' + i + ']');
    }
    obj = obj || window;
    obj.fn = this;
    var result = eval('obj.fn('+ args +')’);
    delete obj.fn;
    return result;
}

apply

讲完了call方法，我们来说一下apply方法，apply方法和call方法非常类似。同样，先来看一下官方的解释：
apply()方法调用一个函数，其具有一个指定的this值，以及作为一个数组（或类数组对象）提供的参数。注意：call()方法的作用和 apply() 方法类似，只有一个区别，就是 call()方法接受的是若干个参数的列表，而apply()方法接受的是一个包含多个参数的数组。

好，我们知道apply和call方法的区别就在于，call是传参数列表，apply是传一个数组。话不多说，开始写代码。

Function.prototype.myapply = function(obj, arr) {

    obj = obj || window;
    obj.func = this;
    var result;
    if(!arr) {
        result = obj.func();
    } else {
        var args = [];
        for (var i = 0, len = arr.length; i < len; i++) {
            args.push('arr[' + i + ']');
        }
        result = eval('obj.func('+ args +')');
    }
    delete obj.func;
    return result;
}

本文参考掘金上面的一篇文章JavaScript深入之call和apply的模拟实现

写这篇博客呢，是为了整理一下call和apply的实现方法，也梳理一下自己的思路，能更好的理解和掌握。
如有错误，恳请指正。