JavaScriptでjoin()を使って文字列を繰り返し連結する方法

JavaScriptで文字列を繰り返し連結する基本

JavaScriptで同じ文字列を複数回連結したい場合、join()メソッドを利用するのが定番のテクニックです。配列の要素数を工夫することで、文字列を「要素数 − 1」回だけ繰り返して連結できます。

join()の仕組み

join()は、配列の各要素を区切り文字（セパレーター）でつなげて1つの文字列に変換するメソッドです。空の配列に対して区切り文字として目的の文字列を指定すると、隣り合う要素同士の間にその文字列が挿入されます。この性質を利用すると、次のような結果が得られます。

• new Array(count + 1).join('John') → 文字列が5回連結される
• new Array(count).join('John') → 文字列が4回連結される

ポイントは、join()が挿入するのは「要素と要素の間」だけなので、連結回数は必ず要素数より1少なくなるという点です。目的の回数だけ繰り返したい場合は、配列サイズを「回数 + 1」で生成します。

コード例

var count = 5;
var values = new Array(count + 1).join('John');
console.log(values);

var count1 = 5;
var values1 = new Array(count1).join('John');
console.log(values1);

上記のプログラムを実行するには、Node.jsで次のコマンドを実行します。

node fileName.js

ここでは、ファイル名を「demo274.js」としています。

実行結果

コンソールには以下のように出力されます。

PS C:\Users\Amit\javascript-code> node demo274.js
JohnJohnJohnJohnJohn
JohnJohnJohnJohn

補足：repeat()を使ったモダンな書き方

ES6以降の環境では、より直感的なString.prototype.repeat()メソッドも使えます。こちらは指定した回数どおりに文字列を繰り返します。

const result = 'John'.repeat(5);
console.log(result); // JohnJohnJohnJohnJohn

join()方式は「回数 − 1」になる点に注意が必要ですが、古い実行環境でも動作するというメリットがあります。repeat()は回数どおりに繰り返せるため可読性が高く、対応環境が許すならこちらを選ぶのがおすすめです。プロジェクトの要件に合わせて使い分けましょう。