(JavaScript) ファイル名から拡張子を取得する方法

本記事では、
JavaScriptでファイル名から拡張子を取得する方法を紹介していく。

JavaScriptでファイルの拡張子を取得する方法

結論から言うと、JavaScriptでファイルの拡張子を取得するには、以下のような手順を実施する。

そんなに難しくないので、詳しい説明は抜きにして、
実際にJavaScriptでファイルの拡張子を取得するサンプルコードを見てもらった方が早いだろう。

let file = 'sample.png';

let file_type = file.split('.').pop();

console.log(file_type);

// png

sample.pngと言うファイル名から、
「.」を区切り文字にファイル名分割して、配列から最後の値を取得している例だ。

ファイル名には複数の「.」がある場合があるので、この方法を使う場合は例えばファイル名に「.」がひとつしかないと想定した場合の[1]ではなくpop()を利用した方が安全だ。

(おまけ) split()とpop()メソッドの使い方

ここからはおまけとして、本記事で扱った
split()とpop()メソッドについて、簡単に使い方を紹介しておく。

文字列を分割する(split)

split メソッドは、対象の文字列を指定した区切り文字で分割し、分割された文字列をそれぞれ要素として格納した配列を返すメソッドだ。書式は次のとおり。

文字列.split([区切り文字[, 最大分割回数]])

• 引数の区切り文字には文字列または正規表現オブジェクトを指定する。
• 1 文字だけでなく複数の文字の並びを指定することもできる。
• 分割された部分文字列がそれぞれ要素として格納された配列が返される。
• 区切り文字が省略された場合は、文字列全体が要素として格納された配列が返される。

最大分割回数を指定した場合、指定した回数だけ区切り文字が現れた時点で分割を終了します。注意点としては、最後に分割された部分文字列は戻り値の配列に格納されますが、最後の区切り文字以降の文字列は戻り値には含まれない。

以下split()のサンプル。

let months = 'Jan..Feb..Mar..Apr..May..Jun';

let monthAry = months.split('..');

console.log(monthAry);

>> (6) ["Jan", "Feb", "Mar", "Apr", "May", "Jun"]

配列の最後の要素を削除する (pop)

pop メソッドを使うと配列の最後の要素を削除することができる。
書式は次の通り。

配列名.pop()

• 配列の最後の要素を削除し、その要素を戻り値として返す。
• 配列がもともと空だった場合は undefined を返す。

let fruit = ['apple', 'melon', 'peach'];

fruit.pop()

console.log(fruit);

>> ["apple", "melon"]

配列の一番最後の要素が削除された。

参考：https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/split

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/pop

内部リンク：

(JavaScript) Jsonデータの読み込み・書き込み方法