第一種：用連接符“+”連接字符串

str="a";
str+="b";

這種方法相對(duì)以下兩種，最便捷快速。建議100字符以下的連接使用這種連接方式。

第二種：以數(shù)組作為中介，使用jion函數(shù)進(jìn)行連接

var arr=new Array();
arr.push(a);
arr.push(b);
var str=arr.join("");

第三種：利用對(duì)象屬性連接字符串

function stringConnect(){
  this._str_=new Array();
}
stringConnect.prototype.append=function(a){
  this._str_.push(a);
}
stringConnect.prototype.toString=function(){
  return this._str_.join();
}
  var mystr=new stringConnect;
  mystr.append("a");
  var str=mystr.toString(); 

利用下面代碼對(duì)三種方法性能進(jìn)行比較，通過(guò)更改 c 的值來(lái)調(diào)整連接字符串的個(gè)數(shù)：

var str="";
var d1,d2;
var c=5000;//連接字符串的個(gè)數(shù)
//------------------------測(cè)試第三種方法耗費(fèi)時(shí)間-------
 d1=new Date();
function stringConnect(){
  this._str_=new Array();
}
stringConnect.prototype.append=function(a){
  this._str_.push(a);
}
stringConnect.prototype.toString=function(){
  return this._str_.join("");
}
  var mystr=new stringConnect;

  for(var i=0;i<c;i++){
    mystr.append("a");
  }
str=mystr.toString();
 d2=new Date();
 console.log(d2.getTime()-d1.getTime());
//-----------------------------------------------------

//------------------------測(cè)試第二種方法耗費(fèi)時(shí)間-------
d1=new Date();
  var arr=new Array();
for(var i=0;i<c;i++){
  arr.push("a");
}
str=arr.join("");
  d2=new Date();
console.log(d2.getTime()-d1.getTime());
//-------------------------------------------------------
//------------------------測(cè)試第一種方法耗費(fèi)時(shí)間-------
d1=new Date();for(var i=0;i<c;i++){
  str+="a";
}
d2=new Date();
console.log(d2.getTime()-d1.getTime());
//-------------------------------------------------------

我調(diào)整 c 分別等于5000、50000、500000、5000000，每個(gè)數(shù)值分別測(cè)了10次，最后結(jié)果如下：

c=5000
                                                                             平均耗時(shí)（單位毫秒）

第三種   3   2   2   3   1   2  2  1   1   1                              1.8
第二種   1   3   0   3   1   3  4  1   4   2                              2.2
第一種   0   0   0   0   0   1  1  1   1   1                              0.5

c=50000

第三種   22  12     9   14    12   13   13   13   10   17          13.5
第二種   8    13   12     8    11   11     8     9     8    9          9.7
第一種   7    12     5    11   10   10   10    13   16  12          10.6

c=500000

第三種 104 70 74 69 76 77 69 102 73 73                            78.7
第二種 78 100 99 99 100 98 96 71 94 97                             93.2
第一種 90 87 83 85 85 83 84 83 88 86                                 85.4

c=5000000

第三種 651 871 465 444 1012 436 787 449 432 444             599.1
第二種 568 842 593 747 417 747 719 549 573 563               631.8
第一種 516 279 616 161 466 416 201 495 510 515               417.5

統(tǒng)計(jì)5000000的時(shí)候在地址欄加入了隨機(jī)參數(shù)，應(yīng)該是避免了緩存的影響的。從結(jié)果來(lái)看，第一種方法并不比另2種方法消耗多，甚至還更有優(yōu)勢(shì)，這點(diǎn)和手冊(cè)上的說(shuō)明明顯不一致。

測(cè)試系統(tǒng)：win 7旗艦

瀏覽器：chrome 52.0.2739.0 m

總結(jié)

以上所述是小編給大家介紹的Javascript三種字符串連接方式及性能比較，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

最新評(píng)論