Javascriptの3種類の文字列接続方式と性能比較


第一種類:コネクタ「+」で文字列を接続する
str=「a」
str+=「b」
この方法は以下の2つに対して最も便利で高速です。100文字以下の接続はこのような接続方式を使用することを推奨します。
第二種類:配列を仲介として、ジオン関数を使って接続する。

var arr=new Array();
arr.push(a);
arr.push(b);
var str=arr.join("");
第三種類:対象属性を利用して文字列を接続する

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(); 
以下のコードを用いて3つの方法の性能を比較し、cの値を変更することにより接続文字列の個数を調整する。

var str="";
var d1,d2;
var c=5000;//        
//------------------------           -------
 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());
//-----------------------------------------------------

//------------------------           -------
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());
//-------------------------------------------------------
//------------------------           -------
d1=new Date();for(var i=0;i<c;i++){
  str+="a";
}
d2=new Date();
console.log(d2.getTime()-d1.getTime());
//-------------------------------------------------------

私はcを調整してそれぞれ5000、50000、500000、5000000に等しくて、それぞれの数値はそれぞれ10回測定しました。最後の結果は以下の通りです。
c=5000
                                                                             平均時間(単位ミリ秒)
第三種   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
第3種104 70 74 69 69 69 69 69 102 73                            78.7
第二種類78百99 99 99百98 96 71 94                             93.2.
第一種類90 87 83 85 85 84 88                                 85.4
c=5000000
第三の651 871 465 444 1012 436 787 442 444             599.1
第二の568 842 593 747 747 719 549 573 563               631.8
第1種516 279 616 161 466 201 495 515               417.5
統計5000000の時、アドレスバーにランダムパラメータを追加しました。キャッシュの影響を避けたはずです。結果から見ると、第一の方法は他の2つの方法より多く消費されず、さらに有利であることはマニュアルの説明と明らかに一致しない。
テストシステム:win 7フラッグシップ
ブラウザ:chrome 52.0.2739.0 m
締め括りをつける
以上は小编で绍介したJavascriptの3つの文字列の接続方式と性能の比较で、皆さんに助けを求めています。ここでも私たちのサイトを応援してくれてありがとうございます。