JavaScript 文字列を区切り文字で分割する(split)

JavaScriptのsplitメソッドのサンプルです。
文字列を区切り文字で分割します。

目次

splitメソッド

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

カンマで分割する

3行目は、splitメソッドを使用して2行目の文字列をカンマ区切りで配列にしています。
5行目は、for...in文で3行目の配列の値を取得しています。

<script>
	str1 = "赤,黄,青";
	arry1 = str1.split(","); //配列

	for( var i in arry1 ){ //配列の値を取得
		document.write(i + arry1[i]); //0赤1黄2青
	}
</script>

半角スペースで分割する(正規表現)

3行目は、正規表現で半角スペースを指定しています。(円記号+Sです)
4行目は、splitメソッドを使用して2行目の文字列を3行目の正規表現で区切って配列にしています。

<script>
	str1 = "赤 黄 青";
	p1 = /\s/;  //円記号+S
	arry1 = str1.split(p1);

	for( var i in arry1 ){ //配列の値を取得
		document.write(i + arry1[i]); //0赤1黄2青
	}
</script>

区切り文字2つで分割する(正規表現)

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

<script>
	str1 = "あ,い:う,え";
	p1 = /[,:]/; 
	arry1 = str1.split(p1); //配列

	for( var i in arry1 ){ //配列の値を取得
		document.write(i + arry1[i]); //0あ1い2う3え
	}
</script>

文字列で分割する(正規表現)

3行目は、正規表現で小文字のaaという文字列を指定しています。
4行目は、splitメソッドを使用して2行目の文字列を3行目の正規表現で区切って配列にしています。
aaのみで分割されます。AaとaAでは分割されません。

<script>
	str1 = "あAaいaaうaAえ";
	p1 = /aa/; 
	arry1 = str1.split(p1); //配列

	for( var i in arry1 ){ //配列の値を取得
		document.write(i + arry1[i]); //0あAaい1うaAえ
	}
</script>

文字列で分割+大文字小文字を区別しない(正規表現)

3行目は、正規表現で小文字のaaという文字列を指定しかつiオプションを指定しています。
iオプションは、大文字と小文字の区別をしません。
4行目は、splitメソッドを使用して2行目の文字列をaaとAaとaAで分割して配列にしています。

<script>
	str1 = "あAaいaaうaAえ";
	p1 = /aa/i; 
	arry1 = str1.split(p1); //配列

	for( var i in arry1 ){ //配列の値を取得
		document.write(i + arry1[i]); //0あ1い2う3え
	}
</script>

配列の要素数を指定する(正規表現)

3行目は、splitメソッドの2つめの引数にlimitを指定して、文字列を配列にしています。
2個の配列が作成されます。

<script>
	str1 = "A,B,C";
	arry1 = str1.split(",",2); //配列

	for( var i in arry1 ){ //配列の値を取得
		document.write(i + arry1[i]); //0A1B
	}
</script>

正規表現の構文

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

var 変数 = /正規表現のパターン/オプション
var 変数 = 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メソッドの場合、このオプションがなくても全て返す(場所3参照)
i 大文字と小文字の区別をしない(Case-insensitive search.)
m 複数行をマッチする

関連の記事

JavaScript 文字列から文字列の一部を取得する(substring)
JavaScript 文字列から文字列の一部を取得する(slice)
JavaScript 文字列から文字列の一部を取得する(substr)
JavaScript 文字列から1文字を取得する(charAt)
JavaScript 文字列の長さ/配列と連想配列の要素数を取得する(length)
JavaScript 文字列の位置を取得するサンプル(indexOfとlastIndexOf)
JavaScript 文字列の大文字と小文字を変換する(toLowerCaseとtoUpperCase)
JavaScript 文字列を置き換える(replace)
JavaScript 正規表現で文字列を検索する(match)

 はまったらエンジニア特化型Q&Aサイト
【teratail(テラテイル)】で質問しましょう!


△上に戻る