split を一言でいうと
split は、
「1つの文字列を、区切り文字で“バラして配列にする”メソッド です。
「カンマ区切りの文字列を、1つずつに分けたい」
「スペースごとに単語に分けたい」
「URL を / ごとに分解したい」
こういうときに、split が活躍します。
ここが重要です。split は「文字列 → 配列」に変えるための道具。
“区切り文字で切ると、配列が手に入る”というイメージをしっかり持ってください。
split の基本：区切り文字で分けて配列にする
基本構文と一番シンプルな例
基本の形はこうです。
文字列.split(区切り文字)
戻り値は「配列」です。
const text = "apple,banana,orange";
const fruits = text.split(",");
console.log(fruits); // ["apple", "banana", "orange"]
console.log(fruits[0]); // "apple"
console.log(fruits[1]); // "banana"
console.log(fruits[2]); // "orange"
"," を「区切り文字」として文字列を切り分け、それぞれが配列の要素になります。
ここで起きていることは、
"apple,banana,orange"
を
「カンマごとに切って」 → "apple" "banana" "orange"
それを ["apple", "banana", "orange"] という配列にして返す
という流れです。
スペースで区切って「単語の配列」にする
const sentence = "I love JavaScript";
const words = sentence.split(" ");
console.log(words); // ["I", "love", "JavaScript"]
" "（半角スペース）を区切りにして単語ごとに分割しています。
ここが重要です。
split は「区切り文字」を挟んで、左右の文字列を要素にしていく。
区切り文字そのものは、結果の配列には含まれません。
区切り文字を変えると何が起きるかを体感する
区切り文字を「.」にする
const ip = "192.168.0.1";
const parts = ip.split(".");
console.log(parts); // ["192", "168", "0", "1"]
ドットごとに分解して、IP アドレスの各部分を配列で扱えるようにしています。
区切り文字を「/」にして URL を分解する
const url = "https://example.com/users/123";
const parts = url.split("/");
console.log(parts);
// ["https:", "", "example.com", "users", "123"]
2番目の要素が ""（空文字）になっているのは、https:// の部分が "https:" と "" として分かれているからです。
このように、「どこで区切るか」によって、配列の形は大きく変わります。
ここが重要です。
split の挙動を理解するには、「区切り文字の両側がどう切り出されるか？」を頭の中でシミュレーションする癖を付けると、とても分かりやすくなります。
特殊なパターン：区切り文字を省略 / 空文字にする
引数を省略した場合
split() の引数を省略すると、
元の文字列を「そのまま 1 要素の配列」として返します。
const text = "hello";
const result = text.split();
console.log(result); // ["hello"]
console.log(result.length); // 1
あまり使う場面は多くありませんが、
「配列として扱いたいけれど、とりあえず 1 個だけ要素を持たせたい」
というケースで使うこともあります。
空文字で split(“”)：1文字ずつに分割される
split("") のように、空文字を区切りとして指定すると、
「1 文字ずつ」に分解されます。
const text = "abc";
const chars = text.split("");
console.log(chars); // ["a", "b", "c"]
日本語でも同じことができます。
const text = "あいう";
const chars = text.split("");
console.log(chars); // ["あ", "い", "う"]
ただし、絵文字や一部の特殊な文字は内部的に 2 つに分かれてしまう場合があるので、
「見た目上の 1 文字」と「split(“”) の結果の 1 要素」がズレることもある、という点だけ頭の片隅に置いておいてください。
ここが重要です。split("") は「1 文字ずつバラす」便利ワザ。
ただし、絵文字や複雑な Unicode では、見た目の 1 文字が 2 要素に割れてしまうことがある点は覚えておくと安心です。
第2引数：最大いくつの要素に分割するかを制限できる
split(区切り文字, limit) の形
split には、第2引数 limit を渡せます。
文字列.split(区切り文字, 最大要素数)
この 最大要素数 を超える分は、無視されます。
例：
const text = "apple,banana,orange,grape";
const fruits1 = text.split(",", 2);
console.log(fruits1); // ["apple", "banana"]
const fruits2 = text.split(",", 3);
console.log(fruits2); // ["apple", "banana", "orange"]
"," で分割すると本来は 4 要素になりますが、
第2引数で「2 つまで」「3 つまで」と制限しているわけです。
「先頭の何個かだけ」が欲しいときに便利
例えば、CSV のようなデータで、
「先頭の 2 カラムだけ見たい」
というときには、第2引数を使うと効率的です。
const line = "id,name,age,city";
const parts = line.split(",", 2);
console.log(parts); // ["id", "name"]
後ろの age,city を無視したい場合に、この書き方が使えます。
ここが重要です。
split は「どこで区切るか」だけでなく、「いくつに分けるか」もコントロールできる。
必要な情報が先頭にまとまっている場合、第2引数の limit を使うと効率よく取り出せます。
典型的な実用パターンでイメージを固める
CSV 風の文字列から配列を作る
const csv = "Taro,20,Tokyo";
const parts = csv.split(",");
const name = parts[0];
const age = parts[1];
const city = parts[2];
console.log(name); // "Taro"
console.log(age); // "20"
console.log(city); // "Tokyo"
配列と組み合わせることで、
「カンマ区切りの 1 行」を「意味のある 3 つの情報」に分解できます。
複数行のテキストを「行ごと」に分ける
ファイルやテキストエリアから読み込んだ文字列を、
行単位で処理したいことはよくあります。
const text = `1行目
2行目
3行目`;
const lines = text.split("\n");
console.log(lines); // ["1行目", "2行目", "3行目"]
これで、for 文で 1 行ずつ処理できるようになります。
for (const line of lines) {
console.log("行:", line);
}
URL パスから ID を取り出す
const url = "/users/12345/profile";
const parts = url.split("/");
// ["", "users", "12345", "profile"]
const userId = parts[2];
console.log(userId); // "12345"
split("/") の結果から、
「何番目の部分が何を意味しているか」を知っていれば、
欲しい情報を取り出せます。
ここが重要です。
split の戻り値は「配列」なので、配列の知識と組み合わせることで、
文字列をデータ構造として扱えるようになる。
カンマ区切り・改行区切り・スラッシュ区切りなど、現実のデータ形式と直結しています。
split を使うときに意識しておきたいポイント
区切り文字そのものは結果に含まれない
const text = "a,b,c";
const parts = text.split(",");
console.log(parts); // ["a", "b", "c"]
この中に "," は含まれていません。
区切り文字は、ただ「境界」として使われるだけです。
逆に、「区切り文字も欲しい」という場合は、split の代わりに正規表現や他の手段を考える必要があります。
区切り文字が見つからない場合は「元の文字列だけを要素にもつ配列」
const text = "hello";
console.log(text.split(",")); // ["hello"]
カンマがないので、
分割されず、「そのまま 1 要素の配列」になります。
連続した区切り文字と空文字
const text = "a,,b";
const parts = text.split(",");
console.log(parts); // ["a", "", "b"]
カンマが2つ連続している部分は、
その間に「空文字」があるとみなされ、"" が要素として入ります。
ここが重要です。
split の結果に ""（空文字）が現れたら、「区切り文字が連続していた」か、「先頭／末尾が区切りで始まって／終わっている」サイン。
データとしてそれを許容するかどうかは、仕様として意識しておく必要があります。
初心者として split で本当に押さえてほしいこと
最後に、split についての核心だけをまとめます。
split(区切り文字) は、「文字列を区切り文字で分割して配列にする」メソッド。
結果は必ず「配列」で返ってくる。
カンマ、スペース、ドット、スラッシュ、改行など、
どんな文字列でも「区切り文字」として指定できる。
split("") で 1 文字ずつに分解できるが、絵文字など一部の文字では“見た目の 1 文字”が 2 要素に割れることもある。
第2引数 split(区切り文字, 最大要素数) で、「いくつまで分けるか」を制限できる。
先頭の何個かだけ取りたいときに便利。
区切り文字が見つからなければ、「元の文字列 1 個だけを要素にもつ配列」が返る。
ここが重要です。
split は「現実世界の“区切られたテキスト”を、プログラムで扱いやすい配列に変換するための入り口」です。
“この文字列は、何で区切られている情報なんだろう？”と考えて、
それをそのまま split の第1引数にしてみる──
この発想が身につくと、文字列処理の世界が一気に広がります。
小さな練習として、次のようなコードを自分で試してみてください。
const line = "name:Taro,age:20,city:Tokyo";
// 1. カンマで分割
const pairs = line.split(",");
// 2. それぞれを「:」で分割してキーと値に分ける
for (const pair of pairs) {
const [key, value] = pair.split(":");
console.log(key, "=>", value);
}
これを実行してみると、
「split を重ねることで、“1行のテキスト”から“意味のあるデータ構造”を作れる」
という感覚が、かなりはっきり掴めてくるはずです。