apply()方法和call()方法


apply()&call()

  之前涉及到一次關於apply和call的代碼,當時沒有時間整理,今天趁着空閑時間來整理一下兩個方法的區別和使用方法。

  其實每個function函數都有一個apply()和call()方法,他們的作用相同,都是在特定的作用域中調用函數,等於設置函數體內this的指向

  定義

  apply:調用一個對象的一個方法,用另一個對象替換當前對象。例如:B.apply(A, arguments);即A對象應用B對象的方法。

call:調用一個對象的一個方法,用另一個對象替換當前對象。例如:B.call(A, args1,args2);即A對象調用B對象的方法

從定義中可以看出,call和apply都是調用一個對象的一個方法,用另一個對象替換當前對象。而不同之處在於傳遞的參數,apply最多只能有兩個參數——新this對象和一個數組argArray,如果arg不是數組則會報錯TypeError;

call則可以傳遞多個參數,第一個參數和apply一樣,是用來替換的對象,后邊是參數列表。

基本語法

/*apply()方法*/
function.apply(thisObj[, argArray])

/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);

  用法實例

  apply()

 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();

  call()

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
    </body>
    <script type="text/javascript">
        var obj = {
            name: "liSen",
            speak: function(say) {
                console.log(say + " " + this.name)
            }
        }
        obj.speak("hello");    //結果:speak liSen
        
        var obj2 = {
            name:"riwen"
        }
        
        //利用call改變this的指向
        obj.speak.call(obj2,"hello");    //結果:hello riwen
    </script>
</html>

 

不同點:接收參數的方式不同。

  • apply()方法 接收兩個參數,一個是函數運行的作用域(this),另一個是參數數組。

語法:apply([thisObj [,argArray] ]);,調用一個對象的一個方法,2另一個對象替換當前對象。

說明:如果argArray不是一個有效數組或不是arguments對象,那么將導致一個 
TypeError,如果沒有提供argArray和thisObj任何一個參數,那么Global對象將用作thisObj。

  • call()方法 第一個參數和apply()方法的一樣,但是傳遞給函數的參數必須列舉出來。

語法:call([thisObject[,arg1 [,arg2 [,...,argn]]]]);,應用某一對象的一個方法,用另一個對象替換當前對象。

說明: call方法可以用來代替另一個對象調用一個方法,call方法可以將一個函數的對象上下文從初始的上下文改變為thisObj指定的新對象,如果沒有提供thisObj參數,那么Global對象被用於thisObj

apply的一些其他巧妙用法

(1)Math.max 可以實現得到數組中最大的一項:

因為Math.max不支持Math.max([param1,param2])也就是數組,但是它支持Math.max(param1,param2...),所以可以根據apply的特點來解決 var max=Math.max.apply(null,array),這樣就輕易的可以得到一個數組中的最大項(apply會將一個數組轉換為一個參數接一個參

數的方式傳遞給方法)

這塊在調用的時候第一個參數給了null,這是因為沒有對象去調用這個方法,我只需要用這個方法幫我運算,得到返回的結果就行,所以直接傳遞了一個null過去。

用這種方法也可以實現得到數組中的最小項:Math.min.apply(null,array)

<script type="text/javascript">
        //求數組中的最大項
        var arr = [1,3,5,7,8,9,12,45];
        var max = Math.max.apply(null,arr);
        console.log(max);
        //求數組最小值
        var min = Math.min.apply(null,arr);
        console.log(min);
    </script>

(2)Array.prototype.push可以實現兩個數組的合並

同樣push方法沒有提供push一個數組,但是它提供了push(param1,param2...paramN),同樣也可以用apply來轉換一下這個數組,即:

var arr1=new Array("1","2","3");
var arr2=new Array("4","5","6");
Array.prototype.push.apply(arr1,arr2);    //得到合並后數組的長度,因為push就是返回一個數組的長度

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM