js apply()與call()方法詳解

來源:互聯網
上載者:User

js apply()與call()方法詳解

 

  1. Js apply方法詳解
  2. 我在一開始看到javascript的函數apply和call時,非常的模糊,看也看不懂,最近在網上看到一些文章對apply方法和call的一些樣本,總算是看的有點眉目了,在這裡我做如下筆記,希望和大家分享.. 如有什麼不對的或者說法不明確的地方希望讀者多多提一些意見,以便共同提高..
  3.  
  4. 主要我是要解決一下幾個問題:
  5.  
  6. 1.apply和call的區別在哪裡
  7.  
  8. 2.什麼情況下用apply,什麼情況下用call
  9.  
  10. 3.apply的其他巧妙用法(一般在什麼情況下可以使用apply)
  11.  
  12. 我首先從網上查到關於apply和call的定義,然後用樣本來解釋這兩個方法的意思和如何去用.
  13.  
  14. apply:方法能劫持另外一個對象的方法,繼承另外一個對象的屬性.
  15.  
  16. Function.apply(obj,args)方法能接收兩個參數
  17. obj:這個對象將代替Function類裡this對象
  18. args:這個是數組,它將作為參數傳給Function(args-->arguments)
  19.  
  20. call:和apply的意思一樣,只不過是參數列表不一樣.
  21.  
  22. Function.call(obj,[param1[,param2[,…[,paramN]]]])
  23. obj:這個對象將代替Function類裡this對象
  24. params:這個是一個參數列表
  25.  
  26. 1.apply樣本:
  27.  
  28. <script type=text/javascript>
  29. /*定義一個人類*/
  30. function Person(name,age) {
  31. this.name=name; this.age=age;
  32. }
  33. /*定義一個學生類*/
  34. functionStudent(name,age,grade) {
  35. Person.apply(this,arguments); this.grade=grade;
  36. }
  37. //建立一個學生類
  38. var student=new Student(qian,21,一年級);
  39. //測試
  40. alert(name:+student.name++age:+student.age++grade:+student.grade);
  41. //大家可以看到測試結果name:qian age:21 grade:一年級
  42. //學生類裡面我沒有給name和age屬性賦值啊,為什麼又存在這兩個屬性的值呢,這個就是apply的神奇之處.
  43. </script>
  44.  
  45. 分析: Person.apply(this,arguments);
  46.  
  47. this:在建立對象在這個時候代表的是student
  48.  
  49. arguments:是一個數組,也就是[“qian”,”21”,”一年級”];
  50.  
  51. 也就是通俗一點講就是:用student去執行Person這個類裡面的內容,在Person這個類裡面存在this.name等之類的語句,這樣就將屬性建立到了student對象裡面
  52.  
  53.  
  54.  
  55. 2.call樣本
  56.  
  57. 在Studen函數裡面可以將apply中修改成如下:
  58.  
  59. Person.call(this,name,age);
  60.  
  61. 這樣就ok了
  62.  
  63. 3.什麼情況下用apply,什麼情況下用call
  64.  
  65. 在給對象參數的情況下,如果參數的形式是數組的時候,比如apply樣本裡面傳遞了參數arguments,這個參數是數群組類型,並且在調用Person的時候參數的列表是對應一致的(也就是Person和Student的參數列表前兩位是一致的) 就可以採用 apply , 如果我的Person的參數列表是這樣的(age,name),而Student的參數列表是(name,age,grade),這樣就可以用call來實現了,也就是直接指定參數列表對應值的位置(Person.call(this,age,name,grade));
  66.  
  67. 4.apply的一些其他巧妙用法
  68.  
  69. 細心的人可能已經察覺到,在我調用apply方法的時候,第一個參數是對象(this), 第二個參數是一個數組集合,
  70.  
  71. 在調用Person的時候,他需要的不是一個數組,但是為什麼他給我一個數組我仍然可以將數組解析為一個一個的參數,
  72.  
  73. 這個就是apply的一個巧妙的用處,可以將一個數組預設的轉換為一個參數列表([param1,param2,param3] 轉換為 param1,param2,param3) 這個如果讓我們用程式來實現將數組的每一個項,來裝換為參數的列表,可能都得費一會功夫,藉助apply的這點特性,所以就有了以下高效率的方法:
  74.  
  75.  
  76.  
  77. a)Math.max 可以實現得到數組中最大的一項
  78.  
  79. 因為Math.max 參數裡面不支援Math.max([param1,param2]) 也就是數組
  80.  
  81. 但是它支援Math.max(param1,param2,param3…),所以可以根據剛才apply的那個特點來解決 var max=Math.max.apply(null,array),這樣輕易的可以得到一個數組中最大的一項
  82.  
  83. (apply會將一個數組裝換為一個參數接一個參數的傳遞給方法)
  84.  
  85. 這塊在調用的時候第一個參數給了一個null,這個是因為沒有對象去調用這個方法,我只需要用這個方法幫我運算,得到返回的結果就行,.所以直接傳遞了一個null過去
  86.  
  87. b)Math.min 可以實現得到數組中最小的一項
  88.  
  89. 同樣和 max是一個思想 var min=Math.min.apply(null,array);
  90.  
  91. c)Array.prototype.push 可以實現兩個數組合并
  92.  
  93. 同樣push方法沒有提供push一個數組,但是它提供了push(param1,param,…paramN) 所以同樣也可以通過apply來裝換一下這個數組,即:
  94.  
  95. vararr1=new Array(1,2,3);
  96. vararr2=new Array(4,5,6);
  97. Array.prototype.push.apply(arr1,arr2);
  98.  
  99. 也可以這樣理解,arr1調用了push方法,參數是通過apply將數組裝換為參數列表的集合.
  100.  
  101. 通常在什麼情況下,可以使用apply類似Math.min等之類的特殊用法:
  102.  
  103. 一般在目標函數只需要n個參數列表,而不接收一個數組的形式([param1[,param2[,…[,paramN]]]]),可以通過apply的方式巧妙地解決這個問題!
  104.  
  105.  
  106. 5.總結:
  107.  
  108. 一開始我對apply 非常的不懂,最後多看了幾遍,自己多敲了幾遍代碼,才明白了中間的道理,所以,不管做什麼事情,只要自己肯動腦子,肯動手敲代碼,這樣一個技術就會掌握…
  109.  
  110. 還有比如第四部分得內容,巧妙的解決了實實在在存在的問題,這個肯定不是一個初學者能想到的解決方案(這個也不是我自己想的),沒有對編程有一定認識的不會想到這個的,還是一句話,多積累,多學習,提升自己的能力和對編程思想的理解能力才是最關鍵! 摘自此處:http://blog.csdn.net/business122/article/details/8000676
    1. Js apply方法詳解
    2. 我在一開始看到javascript的函數apply和call時,非常的模糊,看也看不懂,最近在網上看到一些文章對apply方法和call的一些樣本,總算是看的有點眉目了,在這裡我做如下筆記,希望和大家分享.. 如有什麼不對的或者說法不明確的地方希望讀者多多提一些意見,以便共同提高..
    3.  
    4. 主要我是要解決一下幾個問題:
    5.  
    6. 1.apply和call的區別在哪裡
    7.  
    8. 2.什麼情況下用apply,什麼情況下用call
    9.  
    10. 3.apply的其他巧妙用法(一般在什麼情況下可以使用apply)
    11.  
    12. 我首先從網上查到關於apply和call的定義,然後用樣本來解釋這兩個方法的意思和如何去用.
    13.  
    14. apply:方法能劫持另外一個對象的方法,繼承另外一個對象的屬性.
    15.  
    16. Function.apply(obj,args)方法能接收兩個參數
    17. obj:這個對象將代替Function類裡this對象
    18. args:這個是數組,它將作為參數傳給Function(args-->arguments)
    19.  
    20. call:和apply的意思一樣,只不過是參數列表不一樣.
    21.  
    22. Function.call(obj,[param1[,param2[,…[,paramN]]]])
    23. obj:這個對象將代替Function類裡this對象
    24. params:這個是一個參數列表
    25.  
    26. 1.apply樣本:
    27.  
    28. <script type=text/javascript>
    29. /*定義一個人類*/
    30. function Person(name,age) {
    31. this.name=name; this.age=age;
    32. }
    33. /*定義一個學生類*/
    34. functionStudent(name,age,grade) {
    35. Person.apply(this,arguments); this.grade=grade;
    36. }
    37. //建立一個學生類
    38. var student=new Student(qian,21,一年級);
    39. //測試
    40. alert(name:+student.name++age:+student.age++grade:+student.grade);
    41. //大家可以看到測試結果name:qian age:21 grade:一年級
    42. //學生類裡面我沒有給name和age屬性賦值啊,為什麼又存在這兩個屬性的值呢,這個就是apply的神奇之處.
    43. </script>
    44.  
    45. 分析: Person.apply(this,arguments);
    46.  
    47. this:在建立對象在這個時候代表的是student
    48.  
    49. arguments:是一個數組,也就是[“qian”,”21”,”一年級”];
    50.  
    51. 也就是通俗一點講就是:用student去執行Person這個類裡面的內容,在Person這個類裡面存在this.name等之類的語句,這樣就將屬性建立到了student對象裡面
    52.  
    53.  
    54.  
    55. 2.call樣本
    56.  
    57. 在Studen函數裡面可以將apply中修改成如下:
    58.  
    59. Person.call(this,name,age);
    60.  
    61. 這樣就ok了
    62.  
    63. 3.什麼情況下用apply,什麼情況下用call
    64.  
    65. 在給對象參數的情況下,如果參數的形式是數組的時候,比如apply樣本裡面傳遞了參數arguments,這個參數是數群組類型,並且在調用Person的時候參數的列表是對應一致的(也就是Person和Student的參數列表前兩位是一致的) 就可以採用 apply , 如果我的Person的參數列表是這樣的(age,name),而Student的參數列表是(name,age,grade),這樣就可以用call來實現了,也就是直接指定參數列表對應值的位置(Person.call(this,age,name,grade));
    66.  
    67. 4.apply的一些其他巧妙用法
    68.  
    69. 細心的人可能已經察覺到,在我調用apply方法的時候,第一個參數是對象(this), 第二個參數是一個數組集合,
    70.  
    71. 在調用Person的時候,他需要的不是一個數組,但是為什麼他給我一個數組我仍然可以將數組解析為一個一個的參數,
    72.  
    73. 這個就是apply的一個巧妙的用處,可以將一個數組預設的轉換為一個參數列表([param1,param2,param3] 轉換為 param1,param2,param3) 這個如果讓我們用程式來實現將數組的每一個項,來裝換為參數的列表,可能都得費一會功夫,藉助apply的這點特性,所以就有了以下高效率的方法:
    74.  
    75.  
    76.  
    77. a)Math.max 可以實現得到數組中最大的一項
    78.  
    79. 因為Math.max 參數裡面不支援Math.max([param1,param2]) 也就是數組
    80.  
    81. 但是它支援Math.max(param1,param2,param3…),所以可以根據剛才apply的那個特點來解決 var max=Math.max.apply(null,array),這樣輕易的可以得到一個數組中最大的一項
    82.  
    83. (apply會將一個數組裝換為一個參數接一個參數的傳遞給方法)
    84.  
    85. 這塊在調用的時候第一個參數給了一個null,這個是因為沒有對象去調用這個方法,我只需要用這個方法幫我運算,得到返回的結果就行,.所以直接傳遞了一個null過去
    86.  
    87. b)Math.min 可以實現得到數組中最小的一項
    88.  
    89. 同樣和 max是一個思想 var min=Math.min.apply(null,array);
    90.  
    91. c)Array.prototype.push 可以實現兩個數組合并
    92.  
    93. 同樣push方法沒有提供push一個數組,但是它提供了push(param1,param,…paramN) 所以同樣也可以通過apply來裝換一下這個數組,即:
    94.  
    95. vararr1=new Array(1,2,3);
    96. vararr2=new Array(4,5,6);
    97. Array.prototype.push.apply(arr1,arr2);
    98.  
    99. 也可以這樣理解,arr1調用了push方法,參數是通過apply將數組裝換為參數列表的集合.
    100.  
    101. 通常在什麼情況下,可以使用apply類似Math.min等之類的特殊用法:
    102.  
    103. 一般在目標函數只需要n個參數列表,而不接收一個數組的形式([param1[,param2[,…[,paramN]]]]),可以通過apply的方式巧妙地解決這個問題!
    104.  
    105.  
    106. 5.總結:
    107.  
    108. 一開始我對apply 非常的不懂,最後多看了幾遍,自己多敲了幾遍代碼,才明白了中間的道理,所以,不管做什麼事情,只要自己肯動腦子,肯動手敲代碼,這樣一個技術就會掌握…
    109.  
    110. 還有比如第四部分得內容,巧妙的解決了實實在在存在的問題,這個肯定不是一個初學者能想到的解決方案(這個也不是我自己想的),沒有對編程有一定認識的不會想到這個的,還是一句話,多積累,多學習,提升自己的能力和對編程思想的理解能力才是最關鍵!

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.