Javascript apply()和call()方法

來源:互聯網
上載者:User

標籤:測試結果   alert   代碼   max   方法   code   log   ams   func   

Javascript內建對象

首先,我從網上尋找了apply()call()的定義。然後用例子解釋這兩個方法的意思和用法。

    • apply():方法能劫持另一個對象的方法,繼承另一個對象的屬性。

      Function.apply(obj,args):方法能接收兩個參數

      obj:這個對象將代替Function類裡this對象

      args:這個是數組,它將作為參數傳給Function(args-->arguments)

      程式碼範例:

      <script type="text/javascript">    /*定義一個人類*/    function Person(name,age)    {        this.name=name;        this.age=age;    }    /*定義一個學生類*/    function Student(name,age,grade)    {        Person.apply(this,arguments);        this.grade=grade;    }    //建立一個學生類    var student=new Student("qian",21,"一年級");    //測試    alert("name:"+student.name+"\n"+"age:"+student.age+"\n"+"grade:"+student.grade);    //大家可以看到測試結果name:qian  age:21  grade:一年級    //學生類裡面我沒有給name和age屬性賦值啊,為什麼又存在這兩個屬性的值呢,這個就是apply的神奇之處.</script>

      分析: Person.apply(this,arguments);

          this:在建立對象在這個時候代表的是student

          arguments:是一個數組,也就是[“qian”,”21”,”一年級”];

                   也就是通俗一點講就是:用student去執行Person這個類裡面的內容,在Person這個類裡面存在this.name等之類的語句,這樣就將屬性建立到了student對象裡面

 

    • call():方法能劫持另一個對象的方法,繼承另一個對象的屬性。(和apply的意思一樣,只不過是參數列表不一樣.)

       Function.call(obj,[param1[,param2[,…[,paramN]]]])

      obj:這個對象將代替Function類裡this對象

      params:這個是一個參數列表

      程式碼範例(在Student函數裡面可以將apply中修改成如下):

      Person.call(this,name,age);

      最後顯示的效果是一樣的

 

  • 什麼情況下用apply,什麼情況下用call?

    在給對象參數的情況下

    • 如果參數的形式是數組的時候,比如apply樣本裡面傳遞了參數arguments,這個參數是數群組類型,並且在調用Person的時候參數的列表是對應一致的(也就是Person和Student的參數列表前兩位是一致的) 就可以採用 apply
    • 如果我的Person的參數列表是這樣的(age,name),而Student的參數列表是(name,age,grade),這樣就可以用call來實現了,也就是直接指定參數列表對應值的位置(Person.call(this,age,name,grade));
  • apply的一些其他巧妙用法

    在調用apply()方法的時候,第一個參數是對象(this), 第二個參數是一個數組集合, 在調用Person的時候,他需要的不是一個數組,但是為什麼他給我一個數組我仍然可以將數組解析為一個一個的參數,這個就是apply的一個巧妙的用處,可以將一個數組預設的轉換為一個參數列表([param1,param2,param3] 轉換為 param1,param2,param3) 這個如果讓我們用程式來實現將數組的每一個項,來裝換為參數的列表,可能都得費一會功夫,藉助apply的這點特性,所以就有了以下高效率的方法:

    1. Math.max 可以實現得到數組中最大的一項
      因為Math.max 參數裡面不支援Math.max([param1,param2]) 也就是數組但是它支援Math.max(param1,param2,param3…),所以可以根據剛才apply的那個特點來解決
      var max=Math.max.apply(null,array)
      這裡,在調用的時候第一個參數給了null,是因為沒有對象去調用這個方法,只需用這個方法進行運算,得到返回的結果就行,所以直接傳遞了一個null過去
    2. Array.prototype.push 可以實現兩個數組合并
      同樣push方法沒有提供push一個數組,但是它提供了push(param1,param,…paramN) 所以同樣也可以通過apply來裝換一下這個數組,即:
      var arr1=new Array("1","2","3");var arr2=new Array("4","5","6");Array.prototype.push.apply(arr1,arr2);//arr1調用了push方法,參數是通過apply將數組裝換為參數列表的集合

 

 

關於apply和call方法的疑問,是在看別人代碼時候產生的,所以就各種查了一下,很多博主都寫的非常好,總結的知識和通俗的語言讓我這個小菜雞很輕易的理解了~ 為大大們比心。這篇文章的參考:《js中apply使用方法小議》

Javascript apply()和call()方法

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.