這篇文章主要介紹“JavaScript如何組合拼接字符串”的相關(guān)知識,小編通過實(shí)際案例向大家展示操作過程,操作方法簡單快捷,實(shí)用性強(qiáng),希望這篇“JavaScript如何組合拼接字符串”文章能幫助大家解決問題。
創(chuàng)新互聯(lián)專業(yè)為企業(yè)提供新華網(wǎng)站建設(shè)、新華做網(wǎng)站、新華網(wǎng)站設(shè)計(jì)、新華網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)與制作、新華企業(yè)網(wǎng)站模板建站服務(wù),十多年新華做網(wǎng)站經(jīng)驗(yàn),不只是建網(wǎng)站,更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。
JavaScript組合拼接字符串的效率。在腳本開發(fā)過程中,經(jīng)常會按照某個(gè)規(guī)則,組合拼接出一個(gè)大字符串進(jìn)行輸出。比如寫腳本控件時(shí)控制整個(gè)控件的外觀的HTML標(biāo)簽輸出,比如AJAX里得到服務(wù)器端的回傳值后動態(tài)分析創(chuàng)建HTML標(biāo)簽時(shí),不過這里我就不討論拼接字符串的具體應(yīng)用了,我只是想在這里討論一下拼接的效率。
字符串的拼接在我們寫代碼的時(shí)候都是用“+=”這個(gè)運(yùn)算符,s += String; 這是我們最為熟知的寫法,不知道大家有沒有注意過沒有,在組合的字符串容量有幾十K甚至幾百K的時(shí)候,腳本執(zhí)行起來很慢,CPU使用率狂高,例如:
var str = "01234567891123456789212345678931234567894123456789"; str+= "51234567896123456789712345678981234567899123456789/n"; var result = ""; for(var i=0; i<2000; i++) result += str;
就這么一步操作,產(chǎn)生的結(jié)果字符串是200K,耗時(shí)是1.1秒(這個(gè)與電腦配置有關(guān)),CPU的峰值100%。(為了更直觀地看到效果,我多做了些循環(huán))??上攵瓦@么一步操作就消耗了我一秒多的時(shí)間,再加上其它的代碼的時(shí)間消耗,那整個(gè)腳本塊的執(zhí)行時(shí)間就難以忍受了。那有沒有優(yōu)化的方案呢?還有其它的方法嗎?答案當(dāng)然是有的,否則我寫這篇文章就是廢話。
更快的方式就是使用數(shù)組,在循環(huán)拼接的時(shí)候不是相接拼接到某個(gè)字符串里去,而是把字符串放到一個(gè)數(shù)組里,***用數(shù)組.join("") 得到結(jié)果字符串,代碼示例:
var str = "01234567891123456789212345678931234567894123456789"; str+= "51234567896123456789712345678981234567899123456789/n"; var result = "", a = new Array(); for(var i=0; i<2000; i++) a[i] = str; result = a.join(""); a = null;
大家可以測試測試,組合出一個(gè)相同大小的字符串所消耗的時(shí)間,我這里測試出來的結(jié)果是:<15毫秒,請注意,它的單位是毫秒,也就是說組合出這么一個(gè)200K的字符串,兩種模式的時(shí)間消耗是差不多兩個(gè)數(shù)量級。這意味著什么?意味著后者已經(jīng)工作結(jié)束吃完中飯回來,前者還在做著苦力。我寫一個(gè)測試頁面,大家可以把下面這些代碼拷貝下來另存為一個(gè)HTM文件在網(wǎng)頁里打開自己來測試一下兩者之間的效率差,反正我測試的是前者要半分鐘才能完成的事,后者0.07秒就搞定了(循環(huán)10000次)。
字符串拼接次數(shù)
***我再說幾句,是不是以后字符串拼接就一律使用數(shù)組join呢?這個(gè)要看你的實(shí)際需求了,就普通的幾個(gè)或者K級的字節(jié)的組合就沒有必要使用數(shù)組法了,因?yàn)殚_數(shù)組變量也是有消耗的。若有幾K以上的字符串組合,那就是數(shù)組的效率高了。
IE 6.0:
字符串拼接法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 22089毫秒!
數(shù)組賦值join法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 218毫秒!
Firefox 1.0:
字符串拼接法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 1044毫秒!
數(shù)組賦值join法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 1044毫秒!
Mozilla 1.7:
字符串拼接法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 1045毫秒!
數(shù)組賦值join法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 1044毫秒!
Netscape 7.0:
字符串拼接法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 10273毫秒!
數(shù)組賦值join法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 1138毫秒!
Opera 7.54:
字符串拼接法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 6968毫秒!
數(shù)組賦值join法:拼接后的大字符串長 1010000字節(jié),拼接耗時(shí) 6922毫秒!
循環(huán)10000次的測試結(jié)果表明在IE和Netscape里可以大大提高效率,而在Firefox Mozilla Opera 里兩種方法耗時(shí)基本相近,這些
關(guān)于“JavaScript如何組合拼接字符串”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識,可以關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,小編每天都會為大家更新不同的知識點(diǎn)。