基于原生JS实现内置call方法

292 阅读1分钟

使用 call 方法修改 this

  • 语法:函数名.call(ctx, 实参1, 实参2.....)
  • 参数:ctx 将函数中的 this 修改为 ctx; 从第二个参数开始,后面的参数都是传递给函数执行的实参
  • 作用: 修改方法中的关键字为 call方法的第一个实参ctx,并且把后面的参数当做实参传给函数,最后让函数执行;
  • 特殊情况: call的第一个参数传递 null、undefined、或者不传时函数的 this 是 window
/**
 * context 可以不传递,传递必须是引用类型值(因为后面需要给加$fn的属性)
*/
~ function () {
    /* 
        call: 改变函数中的this指向的
    */
    function call(context) {
        // this:fn也就是当前要操作的这个函数的实例
        context = context || window;
        let args = [], // 除第一个参数外剩余的信息值
            result;
        for (let i = 1; i < arguments.length; i++) {
            args.push(arguments[i]);
        }
        context.$fn = this;
        result = context.$fn(...args);
        // ...是es6中的展开运算符, 把数组中的每一项分别的展开传递给函数 相当于=> context.$fn(10,20)
        delete context.$fn;
        return result;
    }

    // 扩展到内置类的原型上
    Function.prototype.call = call;
}()