【js運算性能系列】拼接字符串的方法及性能比較

將多個字符串拼接在一塊兒,一般有如下三種方法,在實踐中都是常常用到的。chrome

  1. 使用字符串鏈接符 ‘+’, 'string1' + 'string2' + ...數組

  2. 使用數組的join函數。先把字符串寫入臨時數組中,而後調用數組的join方法,將其中的字符串元素鏈接起來。瀏覽器

  3. 使用字符串的concat函數。jsp

方法一: 使用字符串鏈接符 ‘+’

var concat1 = function(str1, str2){
    return str1 + str2;
};

方法二: 使用數組的join函數

var concat2 = function(str1, str2){
    var arr = [];
    arr.push(str1);
    arr.push(str2);

    return arr.join();
};

方法三: 使用字符串的concat函數

var concat3 = function(str1, str2){
    return str1.concat(str2);
};

性能總結

我在本地用Benchmark對上述兩種方法作了性能對比,測試環境爲Testing in Chrome 46.0.2490 / Mac OS X 10.10.4,結果以下:函數

concat#+ x 90,483,047 ops/sec ±2.06% (84 runs sampled)
concat#array-jion x 12,303,912 ops/sec ±0.90% (82 runs sampled)
concat#string-concat x 40,845,196 ops/sec ±0.83% (89 runs sampled)
Fastest is concat#+

也就是說在chrome 46下,使用字符串鏈接符‘+’的效率要高不少。
固然這只是在chrome 46環境下的測試,並不能表明全部的瀏覽器平臺。性能

在jsPerf也有相似的性能測試 https://jsperf.com/concat-vs-...
測試效果以下:測試

clipboard.png

到底哪一種方法更高效?這跟各瀏覽器的引擎有關,根據JavaScript 怎樣高效拼接字符串?這篇文章,本身作了個簡單概括。(一家之言,沒作深刻驗證)spa

  1. 在舊瀏覽器(ie7-)下用 join 會更高效。code

  2. 在現代瀏覽器,儘可能用"+",更高效。ip

  3. 固然,在少數現代瀏覽器裏 「+」 不必定會比 join 快(如,safari 5.0.5,opera 11.10)

  4. 自己是字符串數組的,直接 join 會更好。

  5. "+"concat之間,固然是優選使用"+",方便又直觀又高效。

相關文章
相關標籤/搜索