JavaScript 文字列を分割して配列にするサンプル(split)

JavaScriptの文字列を分割して配列にするサンプルです。

目次

splitメソッド

変数 = 分割したい文字列.split ([文字列 or 正規表現 [ , 数値] ] );
  • 1つ目の引数(文字列 or 正規表現)にマッチすると、そこで文字列を区切ります。省略可能です。
  • 2つ目の引数(数値)は、分割する数を指定します。省略可能です。
  • 戻り値は文字列の配列を返します。
  • Stringオブジェクトのメソッドです。
  • 以下はMDNのsplitメソッドのリンクです。
    https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/split

カンマで区切る

カンマで区切るサンプルです。

<script>

const str1 = "赤,黄,青";

const a = str1.split(",");

console.log(a); //["赤", "黄", "青"]

</script>

5行目は、文字列をカンマ区切りで配列にしています。

半角スペースで区切る

半角スペースで区切るサンプルです。

<script>

const str1 = "赤 黄 青";

const a = str1.split(/\s/);

console.log(a); //["赤", "黄", "青"]

</script>

5行目は、文字列を半角スペースで区切って配列にしています。(円記号+Sです)

区切り文字が複数ある場合

区切り文字が複数ある場合のサンプルです。

<script>

const str1 = "あ,い:う,え";

const a = str1.split(/[,:]/);

console.log(a); //["あ", "い", "う", "え"]

</script>

5行目の[,:]は、カンマ(,)またはコロン(:)という正規表現です。カンマとコロンで区切っています。
※[,:]の意味は、,:のどれかひとつですが、splitメソッドではすべてになります。オプションのgをつけても付けなくても結果は同じです。

文字列で区切る

文字列で区切るサンプルです。

<script>

const str1 = "AAbbAA";

const a = str1.split(/bb/);

console.log(a); //["AA", "AA"]

</script>

5行目は、文字列bbで分割します。
正規表現のパターンにiオプション(str1.split(/bb/i))を使用すると大文字と小文字の区別をしなくなります。

配列の要素数を指定する

配列の要素数を指定するサンプルです。

<script>

const str1 = "あ,い,う,え";

const a = str1.split(",",2);

console.log(a); //["あ", "い"]

</script>

5行目は、2つ目の引数が2なので戻りの配列の要素数は2つです。

正規表現の構文

正規表現の構文として以下2つがあります。

変数 = /正規表現のパターン/オプション
変数 = new RegExp('正規表現のパターン','オプション') 

正規表現の主なパターン

以下は、正規表現の主なパターンです。

パターン パターンの意味
ABD ABDという文字か。
[ABD] A or B or Dのどれか1文字が入っているか。
[^ABD] A と B と D以外の1文字が入っているか。
[A-D] A or B or C or Dのどれか1文字が入っているか。
A|B|D A or B or Dのどれか1文字が入っているか。
[a-zA-Z] 英字の小文字のaからzまたは大文字のAからZのどれか1文字が入っているか。
^A 先頭の文字はAか。
A$ 最後尾の文字はAか。
* *の直前の文字が0回以上の繰り返し。
+ +の直前の文字が1回以上の繰り返し。
? ?の直前の文字が0回または1回の繰り返し。
{n} n回続いている。
{n,} n回以上続いている。
 . 任意の一文字を表す。
¥s 比較する文字に、空白1文字がある。
¥S 比較する文字に、空白以外の1文字がある。
¥d 比較する文字に、数字1文字がある。 ([0-9]と同じ)
¥D 比較する文字に、数字以外の1文字がある。  ([^0-9]と同じ)
¥w 比較する文字に、小文字の英字 or 大文字の英字 or 数値 or アンダースコアの1文字がある。
[a-zA-Z0-9_]と同じ
¥W ¥wの否定。
[^¥w]と同じ

正規表現の主なオプション

以下は、正規表現の主なオプションです。

オプション 説明
g マッチしたものをすべて返す(Global search.)
→splitメソッドの場合、このオプションがなくても全て返します
i 大文字と小文字の区別をしない(Case-insensitive search.)
m 複数行をマッチする

関連の記事

JavaScript 文字列を置き換える(replace)
JavaScript 正規表現で値を返す(matchメソッド)

△上に戻る