JavaScript - 文字列の一部分の取得

公開日:2018-11-29 更新日:2019-05-13

1. 概要

文字列の一部分を取得します。
取得には、substr()、substring()、slice() を使います。

微妙に引数と動作が異なるため、状況に応じて使いやすいものを使います。
substr() と substring() は、名前が似ているのに引数が異なるため、
近い場所で使う場合は混乱する可能性があります。
その場合は、どちらかに統一して使用した方が良いかもしれません。

substr   (開始インデックス, 文字数)
substring(開始インデックス, 終了インデックス)
slice    (開始インデックス, 終了インデックス)

2.1 先頭の文字列の取得

先頭から6文字取得します。
var s = "いつもお世話になっております。";
console.log( s.substr   (0, 6) );
console.log( s.substring(0, 6) );
console.log( s.slice    (0, 6) );

先頭から取得する場合は、文字数と終了インデックスがたまたま同じになるため、全て同じ結果になります。
いつもお世話
いつもお世話
いつもお世話

2.2 途中の文字列の取得

4文字目から7文字取得します。
var s = "いつもお世話になっております。";
console.log( s.substr   (3, 7) );
console.log( s.substring(3, 10) );
console.log( s.slice    (3, 10) );
お世話になって
お世話になって
お世話になって

2.3 末尾の文字列の取得

末尾から5文字取得します。
開始インデックスは、文字列全体の長さから、取得したい文字数を引いた値になります。
substring() と slice() は、2番目の引数を省略すると、開始インデックス以降の文字列が取得できます。
var s = "いつもお世話になっております。";
console.log( s.substr   (s.length - 5, 5) );
console.log( s.substring(s.length - 5) );
console.log( s.slice    (s.length - 5) );
おります。
おります。
おります。

また slice() は、開始インデックスにマイナスの値を指定すると、
末尾を基点として開始インデックスを指定できます。
末尾から文字数を指定して文字列を取得する場合は、slice() を使うと便利です。

末尾から5文字取得します。
var s = "いつもお世話になっております。";
console.log( s.slice(-5) );
おります。