天天看点

JavaScript中bind-call-apply方法的区别JavaScript中bind-call-apply方法的区别

JavaScript中bind-call-apply方法的区别

一、相同点

他们之间的作用基本上是相同,他们都可以修改函数或方法之中的this为指定的对象,并且返回一个修改之后的函数给我们。如下所示:

let value = {
            name: "name"
        }
        function  test(a, b) {
            console.log(this);
            console.log(a,b);
        }
        //bind方法
        let fn = test.bind(value,10,20);
        fn();
        //call方法
         test.call(value,20,30);
        //apply方法
         test.apply(value,[40,50]);
           
JavaScript中bind-call-apply方法的区别JavaScript中bind-call-apply方法的区别

二、不同点

 bind方法会返回一个新的函数给我们,而call和apply则不会返回一个新的函数。如下所示:

call方法:

let value = {
            name: "name"
        }
        function  test(a, b) {
            console.log(this);
            console.log(a,b);
        }
        let fn = test.bind(value,10,20);
        fn();
        //call方法,不会返回一个新函数
        let cn =test.call(value,20,30);
        cn();
        
           
JavaScript中bind-call-apply方法的区别JavaScript中bind-call-apply方法的区别

apply方法:

let value = {
            name: "name"
        }
        function  test(a, b) {
            console.log(this);
            console.log(a,b);
        }
        let fn = test.bind(value,10,20);
        fn();
        let an =test.apply(value,[40,50]);
        an();
           
JavaScript中bind-call-apply方法的区别JavaScript中bind-call-apply方法的区别

其次,call方法传递的参数是对象,而apply传递的参数是一个数组。

let value = {
            name: "name"
        }
        function  test(a, b) {
            console.log(this);
            console.log(a,b);
        }
        test.call(value,20,30);
        test.apply(value,[40,50]);
           
JavaScript中bind-call-apply方法的区别JavaScript中bind-call-apply方法的区别