Js apply()使用詳解

iOS122 發布于2019-08-26 10:22 / 405人閱讀

摘要：方法詳解我在一開始看到的函數和時非常的模糊看也看不懂最近在網上看到一些文章對方法和的一些示例總算是看的有點眉目了在這里我做如下筆記希望和大家分享如有什么不對的或者說法不明確的地方希望讀者多多提一些意見以便共同提高主要我是要解決一下幾個問題和

Js apply方法詳解
我在一開始看到javascript的函數apply和call時,非常的模糊,看也看不懂,最近在網上看到一些文章對apply方法和call的一些示例,總算是看的有點眉目了,在這里我做如下筆記,希望和大家分享.. 如有什么不對的或者說法不明確的地方希望讀者多多提一些意見,以便共同提高..

主要我是要解決一下幾個問題:

1.apply和call的區別在哪里

2.什么情況下用apply,什么情況下用call

3.apply的其他巧妙用法（一般在什么情況下可以使用apply）

我首先從網上查到關于apply和call的定義,然后用示例來解釋這兩個方法的意思和如何去用.

     apply:方法能劫持另外一個對象的方法，繼承另外一個對象的屬性.

Function.apply(obj,args)方法能接收兩個參數
obj：這個對象將代替Function類里this對象
args：這個是數組，它將作為參數傳給Function（args-->arguments）

     call:和apply的意思一樣,只不過是參數列表不一樣.

Function.call(obj,[param1[,param2[,…[,paramN]]]])
obj：這個對象將代替Function類里this對象
params：這個是一個參數列表

1.apply示例:

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

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

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

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

2.call示例

在Studen函數里面可以將apply中修改成如下:

Person.call(this,name,age);

這樣就ok了

3.什么情況下用apply,什么情況下用call

在給對象參數的情況下,如果參數的形式是數組的時候,比如apply示例里面傳遞了參數arguments,這個參數是數組類型,并且在調用Person的時候參數的列表是對應一致的(也就是Person和Student的參數列表前兩位是一致的) 就可以采用 apply , 如果我的Person的參數列表是這樣的(age,name),而Student的參數列表是(name,age,grade),這樣就可以用call來實現了,也就是直接指定參數列表對應值的位置(Person.call(this,age,name,grade));

4.apply的一些其他巧妙用法

細心的人可能已經察覺到,在我調用apply方法的時候,第一個參數是對象(this), 第二個參數是一個數組集合,

在調用Person的時候,他需要的不是一個數組,但是為什么他給我一個數組我仍然可以將數組解析為一個一個的參數,

這個就是apply的一個巧妙的用處,可以將一個數組默認的轉換為一個參數列表([param1,param2,param3] 轉換為 param1,param2,param3) 這個如果讓我們用程序來實現將數組的每一個項,來裝換為參數的列表,可能都得費一會功夫,借助apply的這點特性,所以就有了以下高效率的方法:

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

因為Math.max 參數里面不支持Math.max([param1,param2]) 也就是數組

但是它支持Math.max(param1,param2,param3…),所以可以根據剛才apply的那個特點來解決 var max=Math.max.apply(null,array),這樣輕易的可以得到一個數組中最大的一項

(apply會將一個數組裝換為一個參數接一個參數的傳遞給方法)

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

b)Math.min 可以實現得到數組中最小的一項

同樣和 max是一個思想 var min=Math.min.apply(null,array);

c)Array.prototype.push 可以實現兩個數組合并

同樣push方法沒有提供push一個數組,但是它提供了push(param1,param,…paramN) 所以同樣也可以通過apply來裝換一下這個數組,即:

vararr1=new Array("1","2","3");
vararr2=new Array("4","5","6");
Array.prototype.push.apply(arr1,arr2);

也可以這樣理解,arr1調用了push方法,參數是通過apply將數組裝換為參數列表的集合.

通常在什么情況下,可以使用apply類似Math.min等之類的特殊用法:

一般在目標函數只需要n個參數列表,而不接收一個數組的形式（[param1[,param2[,…[,paramN]]]]）,可以通過apply的方式巧妙地解決這個問題!

5.總結:

一開始我對apply 非常的不懂,最后多看了幾遍,自己多敲了幾遍代碼,才明白了中間的道理,所以,不管做什么事情,只要自己肯動腦子,肯動手敲代碼,這樣一個技術就會掌握…

還有比如第四部分得內容,巧妙的解決了實實在在存在的問題,這個肯定不是一個初學者能想到的解決方案(這個也不是我自己想的),沒有對編程有一定認識的不會想到這個的,還是一句話,多積累,多學習,提升自己的能力和對編程思想的理解能力才是最關鍵！
參考：https://www.cnblogs.com/xiaoh...

云服務器 GPU云服務器 js的apply() js_function_apply js中的call和apply JS中bind、call和apply的作

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106080.html

前端學習筆記之js中apply()和call()方法詳解

摘要：第二行將函數的指向一個字符串第三行將函數的指向一個數字以此類推。再舉一個例子實現對象繼承繼承了的屬性和方法陳安東男姓名年齡性別輸出姓名陳安東年齡性別男這樣用就實現了繼承用也類似這里排版不是太好，詳情看我的簡書經過網上的大量搜索，漸漸明白了apply()和call方法的使用，為此寫一篇文章記錄一下。定義 apply()方法： Function.apply(obj,args)obj：...

moven_j 2019-08-20 16:20 評論0 收藏0
js 中的 call / apply 方法詳解和引用類型的繼承

摘要：也就是說當使用后，當前執行上下文中的對象已被替換為，后續執行將以所持有的狀態屬性繼續執行。借用的方法替換的實例去調用相應的方法。實現引用類型的繼承其實沒有類這一概念，我們平時使用的等嚴格來說被稱作引用類型。 call 方法：object.method.call(targetObj[, argv1, argv2, .....]) apply 方法：object.method.apply(...

cod7ce 2019-08-21 16:48 評論0 收藏0
JavaScript繼承方式詳解

摘要：可以通過構造函數和原型的方式模擬實現類的功能。原型式繼承與類式繼承類式繼承是在子類型構造函數的內部調用超類型的構造函數。寄生式繼承這種繼承方式是把原型式工廠模式結合起來，目的是為了封裝創建的過程。 js繼承的概念 js里常用的如下兩種繼承方式：原型鏈繼承（對象間的繼承）類式繼承（構造函數間的繼承）由于js不像java那樣是真正面向對象的語言，js是基于對象的，它沒有類的概念。...

Yangyang 2019-08-21 10:23 評論0 收藏0
JavaScript 中 this 的詳解

摘要：作為構造函數調用中沒有類，但是可以從構造器中創建對象，并提供了運算符來進行調用該構造器。構造器的外表跟普通函數一樣，大部分的函數都可以當做構造器使用。如果構造函數顯式的返回一個對象，那么則會指向該對象。 this 的指向 this 是 js 中定義的關鍵字，它自動定義于每一個函數域內，但是它的指向卻讓人很迷惑。在實際應用中，this 的指向大致可以分為以下四種情況。 1.作為普通函數調...

cyrils 2019-08-21 15:27 評論0 收藏0
淺析webpack源碼之入口函數webpack.js詳解（四）

摘要：我們看到引入了對進行分析是一個很大的文件，里面規定了我們隨便看一段這是對你輸入的規定的要求是是其實就是本下的這樣寫可以提取公用的配置，避免代碼冗余一共行，其中就占了行接下里進入函數引入引入了，我們在搜索鏈接我們看到，在文檔里這樣的描述的用法我們看到引入了對webpack.js const validateSchema = require(./validateSchema); con...

zone 2019-08-23 14:45 評論0 收藏0