javascriptで文字列を分割し配列にするsplitの使い方【現役SEが紹介】

プログラミング

javascriptでカンマ区切りの文字列を分割して使用したい。

何かいい方法がないかな。

上記のお悩みを解決します。

■本記事の内容

本記事で以下の内容をお伝えします。

・javascriptで文字列を配列に変換する方法
・split関数の使い方
・split関数を使用するケース

 

■本記事の信頼性

ささそらと
ささそらと

この記事を書いている私は、プログラミングを仕事として始めて10年以上ほど経ちます。今も現役のシステムエンジニアです。

javascriptで文字列を分割し配列にするsplit関数についてお伝えします。

 

頻度はそこまで多くはないですが、ある文字列を指定した文字で分割したいことがあります。

例えばCSVなどのカンマ区切りのファイルだったり、他にはファイル名と拡張を分けたい時だったりなど。

その際にsplitの使い方を知っていると簡単に分割して使用することが可能です。

 

javascriptで文字列を配列に変換する方法

javascriptで文字列を分割し配列にするsplitの使い方

システムのデータの持ち方で、ある文字を区切りとして複数要素を保持することが多々あります。

例えば、よく目にするものですとメールの宛先を複数指定する場合、以下のように;(セミコロン)で区切って複数アドレスを指定されているかと思います。
aaa@test.com;bbb@test.com

 

他には単純に「aaa,bbb,ccc」といったようにカンマ区切りで保持させたりすることもあります。

こういった文字列を保持していた場合、システムとして1つ目のデータが欲しいだったり、最後のデータが欲しいといったことがあります。

上記のようなデータをある指定文字で区切ったデータを分割し、配列として保持することができます。

※配列がイメージできない方は以下の記事にまとめてますので、参照頂けたらと思います。
javascriptの配列(array)の使い方【現役SEが紹介】

 

配列することによって、例えば「aaa,bbb,ccc」のようなデータがあった場合に以下の配列へ変換することができます。
[‘aaa’, ‘bbb’, ‘ccc’]

上記のように配列に変換するsplit関数といったものがあり、その使用方法を次で紹介します。

split関数の使い方

javascriptで文字列を分割し配列にするsplitの使い方

javascriptでsplit関数の使い方を説明していきます。

基本的な書き方としては以下になります。

const mail = 'aaa@test.com;bbb@test.com';

const mails = mail.split(';');
console.log(mails);

分割後のmailsの中身は以下のような感じの配列になります。

> Array ["aaa@test.com", "bbb@test.com"]

書き方としては難しくなく、分割したい文字列変数の後ろに「.split」とつけて、splitの引数に分割したい区切り文字を指定する感じです。
今回の例だと「;」(セミコロン)を指定しています。

後は仕様に応じて、カンマで分割したい場合はsplit()のカッコ内にカンマ指定すればいいし、半角スペースに分割したい場合は半角スペースを指定するといった感じです。

 

もし、分割対象の文字列に指定した区切り文字が存在しなかった場合はエラーにはならず、配列の1要素目に全部入る形になります。

 

ただ、分割対象の文字列の変数がnullやundefinedが入るとエラーになるので注意してください。
split実行前に必ず文字列が入るようにチェックするようにしましょう。

split関数を使用するケース

javascriptで文字列を分割し配列にするsplitの使い方

javascriptで上記のようなsplit関数を使うケース例をあげておきます。

主に以下の用途などが多いかと思います。

・CSVデータの分割
・メールアドレスなど決められたルールで区切った文字列
・ファイル名と拡張子の分解

 

CSVは、「Comma Separated Value」の略でデータをカンマ区切りしたフォーマットのことを指します。
そのまんまですがカンマ区切りのフォーマットなので、各々の値を使用したい場合はカンマごとで分割してやる必要があります。
ただ、CSVデータの分解は自身がsplit関数を使って分解しなくても、既に分解処理してくれて扱いやすいようにしてくれるライブラリがたくさんあるので、基本的にはそちらを使用することが多いです。

 

2つ目は決められたルールで区切られた文字です。こちらはシステム内であらかじめ決めたルールをもとに分割する方式です。
一番多いケースかもしれません。

 

最後の3つ目は拡張子を取得したい場合とかです。
拡張子というのは、ファイルの後ろに付いている「.txt」だったり、「.jpg」といったファイルの種類を表すものです。
ファイル名のルールとして「.」で区切られた最後の文字が拡張子になるので、これを取る際も一旦splitで配列化させてから取得するといったことをします。

最後に

javascriptのsplit関数ついて説明しました。

毎回使用するわけではないですが、文字列を指定文字で分割できることを知っておけば、設計する際にもコーディングする際にも効率がよくなります。

 

内容もそれほど難しいものでもないので、早いうちに使いこなせるようにしておきましょう。

 

 

コメント

タイトルとURLをコピーしました