JavaScriptのtoStringの使い方!配列をカンマ区切り文字列に

JavaScriptで配列を文字列に変換するtoStringメソッドについて解説します。

toStringメソッドを使うと、配列からカンマで区切った文字列を生成できます。
配列の内容を簡単に文字列で確認したい場合や、文字列として処理したい場合に便利です。

実際に動くサンプルを使って、以下の操作を解説します。

・`toString`メソッドの基本的な使い方
・`join`メソッドとの違い

toStringメソッドの基本的な使い方

toStringメソッドは、配列の要素を文字列に変換し、カンマで区切って結合した文字列を返します。
基本的な構文は以下のとおりです。

array.toString()

配列を文字列に変換する

配列を文字列に変換してみます。

const fruits = ['apple', 'banana', 'orange'];
const fruitString = fruits.toString();

console.log(fruitString); // 結果:apple,banana,orange

fruits配列を作成して、次の行でtoStringメソッドを呼び出しています。
配列要素が文字列に変換され、カンマで区切られてfruitString変数に格納されています。

joinメソッドとの違い

配列を文字列に変換するメソッドとしては、joinメソッドも存在します。
joinメソッドは、要素を結合する際の区切り文字を自由に指定できるのに対し、toStringメソッドは常にカンマで区切る点が異なります。

メソッド 処理内容 区切り文字
toString 配列の要素を文字列に変換し、カンマで結合する カンマ
join 配列の要素を文字列に変換し、指定した文字で結合する 自由

どちらのメソッドを使うかは、区切り文字をどのようにしたいかによって選択する必要があります。

下記のようにjoinを使うと、好きな区切り文字を使えます。
カンマ以外で区切りたいときに、joinを使いましょう。

const fruits = ['apple', 'banana', 'orange'];

const fruitToString = fruits.toString(); // 区切り文字は常にカンマ
const fruitJoin = fruits.join('+'); // 区切り文字を+にする

console.log(fruitToString); // 結果: apple,banana,orange
console.log(fruitJoin); // 結果: apple+banana+orange

JavaScriptのtoStringメソッドの使い方まとめ

今回はJavaScriptのtoStringメソッドの使い方について解説しました。
記事の内容をまとめます。

・`toString`メソッドは、配列の要素を文字列に変換し、カンマで区切って結合した文字列を返す。
・`join`メソッドは、要素を結合する際の区切り文字を自由に指定できる。

コメント