[JavaScript知识库]JavaScript中的call()和apply()

JavaScript中的call()和apply()

call方法和apply方法，这两个方法的作用是一样的。都是在特定的作用域中调用函数，等于设置函数体内this对象的值。

举例说明：
首先创建所需对象obj、obj2和函数fun。
分别通过fun直接调用、call()和apply()调用，发现this指向的都是window对象。

 // 创建fun函数
        function fun(){
            alert(this);
        }

        // 创建对象obj
        var obj = {
            name:"obj"
        };
        // 创建对象obj2
        var obj2 = {
            name:"obj2"
        };

		// 直接调用fun，this指向window对象
        fun();
        // 通过call和apply方法不传参数调用，this也是指向window对象
        fun.call();
        fun.apply();

接着我们通过call和apply方法传参obj对象,this指向object，就是obj对象。

// 创建fun函数
        function fun(){
            alert(this);
        }

        // 创建对象obj
        var obj = {
            name:"obj"
        };
        // 创建对象obj2
        var obj2 = {
            name:"obj2"
        };

        // 直接调用fun，this指向window对象
        fun();
        // 通过call和apply方法传参obj对象,this指向object，就是obj。
        fun.call(obj);
        fun.apply(obj);

后面我们更改一下，给obj和obj2一个name属性，更改fun中的this指向name。再去调用函数的call和apply方法并传参obj和obj2，this则会指向obj和obj2的name属性。

        // 创建fun函数
        function fun(){
            // alert(this);
            alert(this.name);
        }

        // 创建对象obj
        var obj = {
            name:"obj"
        };
        // 创建对象obj2
        var obj2 = {
            name:"obj2"
        };

        // 直接调用fun，this指向window对象
        fun();

        // 当让fun函数的this指向name属性时，在去调用函数的call和apply方法并传参obj和obj2，this则会指向obj和obj2的name属性。
        fun.call(obj);
        fun.apply(obj2);

接着我们为obj对象添加sayHello方法，让它打印this.name。这时候让obj去访问这个方法通过call()和apply()并传参obj2。会发现obj的sayHello方法中的this指向obj2的name。

// 创建fun函数
        function fun(){
            // alert(this);
            alert(this.name);
        }

        // 创建对象obj
        var obj = {
            name:"obj",
            sayHello:function(){
                alert(this.name);
            }
        };
        // 创建对象obj2
        var obj2 = {
            name:"obj2"
        };

        // 接着我们为obj对象添加sayHello方法，让它打印this.name。
        //这时候让obj去访问这个方法通过call()和apply()并传参obj2。
        //会发现obj的sayHello方法中的this指向obj2的name。

        obj.sayHello.call(obj2);

这个时候我们就发现了原来这个 call()和apply()都可以改变this的指向方向。 效果差不多。并且call()和apply()可以传其他参数。

        // 创建fun函数，我们向fun函数放进去两个形参，函数打印形参。
        function fun(a,b){
            alert(a);
            alert(b);
        }

        // 创建对象obj
        var obj = {
            name:"obj",
            sayHello:function(){
                alert(this.name);
            }
        };
        // 当我们在调用函数使用call()传参obj的后面加上两个参数，就会发现，你加的两个参数就是这两个形参。
        fun.call(obj,1,2);
        // 而使用apply()传参要用数组符号括起来，因为传进去的是数组，才能有效果。
        fun.apply(obj,[1,2]);

这里call()和apply()的区别就是 ：
call()方法可以将实参在对象之后依次传递。
apply()方法需要将实参封装到一个数组中统一传递。