【JS】call方法重写

132 阅读1分钟

call:是Function类的原型上的一个方法,所有的函数都可以去调用这个方法,call是改变函数里的this指向的

apply: 和 call 一样,只不过第二个参数传递的是一个数组

bind: 预处理this,bind方法执行的时候,不会让fn立即执行,但是他会返回一个改变this指向的新函数

        function fn(n,m){
          console.log(this,n,m);
        }
        let obj = {};
        // fn.call(obj,1,2);
        // 让call执行,当call执行的时候,在call内部让fn执行了

手写一个call方法,但是传参时,第一个参数不能传字面量方式创建的基本数据类型,可以传new 构造函数执行创建的基本数据类型的值。

<script>
     

        function myCall(context, ...arg) {
            // 把当前fn函数添加到obj中,然后执行 obj.fn,当执行形完成之后从obj中把fn删除
            let res = null;
            context = context || window;
            // 如果当前myCall执行的时候实参不传,或者传null,或者传undefined,那得把当前的context的值改为window
            // console.log(arg);
            // this-->fn函数  context-->obj
            context.$fn = this;  // obj.$fn = fn
            res = context.$fn(...arg);       // obj.$fn()
            delete context.$fn;  // delete obj.$fn

            return res;// 把fn函数执行的返回值return 出去了
                      // 这块的return是myCall函数的执行结果
        }

        Function.prototype.myCall = myCall;


        function fn(n, m) {
            console.log(this, n, m);
            return 100;
        }
        let obj = { name: 1 };

        //  console.log(fn.call(obj,1,2));    // this-->obj

        console.log(fn.myCall(obj, 1, 2));

    </script>