call和apply方法详解

每一个函数都包含俩个非继承来的俩个方法，这俩个都可以改变this的指向，但是俩个方法的参数不同，但是作用相同。

call()

调用一个对象的一个方法，以另一个对象替换当前对象

Function.call(obj,args1,args2,...)

• obj : 对象，这个对象将替代Function里面的this对象
• args : 参数，传递给被调函数，可以不指定

<script>
   //例1
        window.color = 'red';
        document.color = 'yellow';
        var s1 = {color: 'blue' };

        function changeColor(){
            console.log(this.color);
        }

        changeColor.call();         //red (默认传递参数)
        changeColor.call(window);   //red
        changeColor.call(document); //yellow
        changeColor.call(this);     //red
        changeColor.call(s1);       //blue

    </script>

    //例2
    var Pet = {
        words : '...',
        speak : function (say) {
            console.log(say + ''+ this.words)
        }
    }

    Pet.speak('Speak'); // 结果：Speak...

    var Dog = {
        words:'Wang'
    }

    //将this的指向改变成了Dog
    Pet.speak.call(Dog, 'Speak'); //结果： SpeakWang

---

apply()

应用某一个对象的一个方法，用另一个对象替换当前对象

Function.apply(obj,args)

• obj : 对象，这个对象将替代Function里面的this对象
• args : 数组或者类数组，传递给被调函数

    //例1
    <script>
        window.number = 'one';
        document.number = 'two';
        var s1 = {number: 'three' };

        function changeColor(){
            console.log(this.number);
        }

        changeColor.apply();         //one (默认传参)
        changeColor.apply(window);   //one
        changeColor.apply(document); //two
        changeColor.apply(this);     //one
        changeColor.apply(s1);       //three

    </script>

    //例2
    function Pet(words){
        this.words = words;
        this.speak = function () {
            console.log( this.words)
        }
    }
    function Dog(words){
        //Pet.call(this, words); //结果： Wang
       Pet.apply(this, arguments); //结果： Wang
    }
    var dog = new Dog('Wang');
    dog.speak();