最新文章專題視頻專題問答1問答10問答100問答1000問答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
當(dāng)前位置: 首頁 - 科技 - 知識百科 - 正文

使用Function.apply()的參數(shù)數(shù)組化來提高JavaScript程序性能的技巧_javascript技巧

來源:懂視網(wǎng) 責(zé)編:小采 時間:2020-11-27 21:47:43
文檔

使用Function.apply()的參數(shù)數(shù)組化來提高JavaScript程序性能的技巧_javascript技巧

使用Function.apply()的參數(shù)數(shù)組化來提高JavaScript程序性能的技巧_javascript技巧:我們再來聊聊Function.apply() 在提升程序性能方面的技巧。 我們先從 Math.max() 函數(shù)說起, Math.max后面可以接任意個參數(shù),最后返回所有參數(shù)中的最大值。 比如 alert(Math.max(5,8)) //8 alert(Math.max(5,7,9,3,1,6
推薦度:
導(dǎo)讀使用Function.apply()的參數(shù)數(shù)組化來提高JavaScript程序性能的技巧_javascript技巧:我們再來聊聊Function.apply() 在提升程序性能方面的技巧。 我們先從 Math.max() 函數(shù)說起, Math.max后面可以接任意個參數(shù),最后返回所有參數(shù)中的最大值。 比如 alert(Math.max(5,8)) //8 alert(Math.max(5,7,9,3,1,6

我們再來聊聊Function.apply() 在提升程序性能方面的技巧。

我們先從 Math.max() 函數(shù)說起, Math.max后面可以接任意個參數(shù),最后返回所有參數(shù)中的最大值。

比如

但是在很多情況下,我們需要找出數(shù)組中最大的元素。


對字符串進(jìn)行循環(huán)操作,譬如替換、查找,應(yīng)使用正則表達(dá)式,因為本身JavaScript的循環(huán)速度就比較慢,而正則表達(dá)式的操作是用C寫成的語言的API,性能很好。

高級對象

自定義高級對象和Date、RegExp對象在構(gòu)造時都會消耗大量時間。如果可以復(fù)用,應(yīng)采用緩存的方式。

DOM相關(guān)

插入HTML

很多人喜歡在JavaScript中使用document.write來給頁面生成內(nèi)容。事實上這樣的效率較低,如果需要直接插入HTML,可以找一個容器元素,比如指定一個div或者span,并設(shè)置他們的innerHTML來將自己的HTML代碼插入到頁面中。

對象查詢

使用[“”]查詢要比.items()更快,這和前面的減少對象查找的思路是一樣的,調(diào)用.items()增加了一次查詢和函數(shù)的調(diào)用。

創(chuàng)建DOM節(jié)點(diǎn)

通常我們可能會使用字符串直接寫HTML來創(chuàng)建節(jié)點(diǎn),其實這樣做

無法保證代碼的有效性

字符串操作效率低

所以應(yīng)該是用document.createElement()方法,而如果文檔中存在現(xiàn)成的樣板節(jié)點(diǎn),應(yīng)該是用cloneNode()方法,因為使用createElement()方法之后,你需要設(shè)置多次元素的屬性,使用cloneNode()則可以減少屬性的設(shè)置次數(shù)——同樣如果需要創(chuàng)建很多元素,應(yīng)該先準(zhǔn)備一個樣板節(jié)點(diǎn)。

定時器

如果針對的是不斷運(yùn)行的代碼,不應(yīng)該使用setTimeout,而應(yīng)該是用setInterval。setTimeout每次要重新設(shè)置一個定時器。

其他

腳本引擎

據(jù)我測試Microsoft的JScript的效率較Mozilla的Spidermonkey要差很多,無論是執(zhí)行速度還是內(nèi)存管理上,因為JScript現(xiàn)在基本也不更新了。但SpiderMonkey不能使用ActiveXObject

文件優(yōu)化

文件優(yōu)化也是一個很有效的手段,刪除所有的空格和注釋,把代碼放入一行內(nèi),可以加快下載的速度,注意,是下載的速度而不是解析的速度,如果是本地,注釋和空格并不會影響解釋和執(zhí)行速度。

總結(jié)

本文總結(jié)了我在JavaScript編程中所找到的提高JavaScript運(yùn)行性能的一些方法,其實這些經(jīng)驗都基于幾條原則:

直接拿手頭現(xiàn)成的東西比較快,如局部變量比全局變量快,直接量比運(yùn)行時構(gòu)造對象快等等。

盡可能少地減少執(zhí)行次數(shù),比如先緩存需要多次查詢的。

盡可能使用語言內(nèi)置的功能,比如串鏈接。

盡可能使用系統(tǒng)提供的API,因為這些API是編譯好的二進(jìn)制代碼,執(zhí)行效率很高

同時,一些基本的算法上的優(yōu)化,同樣可以用在JavaScript中,比如運(yùn)算結(jié)構(gòu)的調(diào)整,這里就不再贅述了。但是由于JavaScript是解釋型的,一般不會在運(yùn)行時對字節(jié)碼進(jìn)行優(yōu)化,所以這些優(yōu)化仍然是很重要的。

當(dāng)然,其實這里的一些技巧同樣使用在其他的一些解釋型語言中,大家也可以進(jìn)行參考。

由于是以前做過的測試,測試代碼已經(jīng)不全,我補(bǔ)充了一部分如下:

附錄2

代碼1:

代碼2:

代碼3:

在firefox下測試這兩段代碼,結(jié)果是代碼2優(yōu)于代碼1和3,而代碼1一般優(yōu)于代碼3,有時會被代碼3超過;而在IE 6.0下,測試壓力較大的時候(如測試10000次以上)代碼2和3則有時候優(yōu)于代碼1,有時候就會遠(yuǎn)遠(yuǎn)落后代碼1,而在測試壓力較?。ㄈ?000次),則代碼2>代碼3>代碼1。

代碼4:

代碼5:

上面兩段代碼在Firefox和IE下測試結(jié)果都是性能接近的。

代碼6:

代碼7:

代碼8:

代碼9:

這四段代碼在Firefox下6和8的性能接近,7和9的性能接近,而6, 8 < 7, 9;

最后我們來看一下空循環(huán)

代碼10:

代碼11:

最后的測試出現(xiàn)了神奇的結(jié)果,F(xiàn)irefox下代碼10所花的時間與代碼11所花的大約是24:1。所以它不具備參考價值,于是我沒有放在一開始給大家看。

聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

本文如未解决您的问题请添加抖音号:51dongshi(抖音搜索懂视),直接咨询即可。

文檔

使用Function.apply()的參數(shù)數(shù)組化來提高JavaScript程序性能的技巧_javascript技巧

使用Function.apply()的參數(shù)數(shù)組化來提高JavaScript程序性能的技巧_javascript技巧:我們再來聊聊Function.apply() 在提升程序性能方面的技巧。 我們先從 Math.max() 函數(shù)說起, Math.max后面可以接任意個參數(shù),最后返回所有參數(shù)中的最大值。 比如 alert(Math.max(5,8)) //8 alert(Math.max(5,7,9,3,1,6
推薦度:
  • 熱門焦點(diǎn)
專題
Top

抖音扫码关注

手机端二维码

每天分享百科知识!