apply方法的实现

下面时对apply方法的实现，了解aplly方法的使用点这里：改变this指向，call，apply，bind的不同

一、apply方法的实现代码

			// 用于改变函数this的对象
            const obj = {
                name: '张三'
            };
            // 带有返回值的测试函数
            function sayHello(age, sex) {
                console.log(`Hello ${this.name},age:${age},sex:${sex}`);
                return {
                    name: this.name,
                    age: age,
                    sex: sex
                }
            }
            Function.prototype.myApply = function (obj, arr) {
                // 拿到obj，如果obj隐式转换是false，那么取window
                const object = obj || window;
                object.fun = this; // 上面已经测试过，this指向的是调用myApply方法的函数，这相当于在对象里创建了一个叫fun的函数，函数体是调用myApply方法的函数
                let result; // 用于后续获取函数的返回值
                if (arr) {
                    // 如果有参数，则将参数解构当作方法的参数
                    // 执行通过this绑定的方法，并拿到返回值，因为函数有可能会有返回值，所以需要接收。这里方法里的this已经指向object了，不明白可以看最下面第五大点。
                    result = object.fun(...arr);
                } else {
                    result = object.fun();
                }
                delete object.fun; //  知识点3，对象是引用传递，我们不能改变传进来的参数，所以我们要从传进来的参数身上把我们通过this绑定的方法删除掉。
                return result; // 返回执行函数的结果。
            }
            console.log(sayHello.myApply(undefined, [18, "男"]));

二、myApply方法测试结果

三、apply方法的实现步骤

1.myApply内部将【第一个参数（this将指向的对象）】身上【添加了一个方法】，【添加的方法】就是【调用myApply的方法】。

2.如果传递了2个参数，应该把第2个参数当作【添加的方法】的参数。

3.然后用这种方式执【添加的方法】：【第一个参数.添加的方法】。并保存他的返回值。

4.执行完【添加的方法】后要删除【添加的方法】。

5.返回执行【添加的方法】后保存的返回值。

细节：js内置apply不传参数或第一个参数传undefined，null时this应该是指向window的;如果第一个参数传入基础数据类型，this应该指向其包装类，这里我们不考虑传递基础数据类型的情况。

四、必备知识点

1.要清楚普通函数的this指向题：【谁调用只想谁，比如：对象调用方法，方法的this指向对象】，apply的实现也是利用了这一点。（了解更多关于this指向问题点这里）

2.实现apply我们就要把自己定义的myApply挂到Function的原型prototype上，这样所有的方法就都可以使用了。

3.对象传递是引用传递。

五、用this将方法绑定到myCall第一个参数上的原理

 // 知识点第二点，挂到原型上
            Function.prototype.myApply = function () {
                console.log(this); // 打印一下this，看看方法调用的时候this指向谁。
            }
            // 定义一个使用myApply的函数。
            function test() {}
            console.group("myApply中的this指向（指向调用myApply方法的函数）")
            test.myApply(); // 输出结果：ƒ test() {} 。
            // 原因就是知识点1，test调用了myApply，所以myApply的this指向了test。
            // 在真是放些apply时也是利用了这一点，把this赋给this将指向的对象里的一个属性，实质是把this原本的方法赋值到了对象的属性上，然后用对象调用属性方法执行，这时属性方法内部的this就指向了这个对象，而属性方法本身就是调用apply时的那个方法。
            console.groupEnd();

到这里就结束了。后续还会有bind方法的实现。

call方法的实现点这里

如果对你有帮助可以👍+关注哦~~我们一起学前端。