概要: このチュートリアルでは、JavaScript String のslice()メソッドを使用して、文字列から部分文字列を抽出する方法を学びます。
JavaScript String slice() メソッドの紹介
String.prototype.slice()メソッドは、文字列の一部を抽出し、部分文字列として返します。 以下にslice()メソッドの構文を示します。
slice(start, end)slice()メソッドには、2つのオプションパラメータstartとendがあります。
start
startパラメータは、メソッドが抽出を開始する0ベースのインデックスです。 例えば
const str = 'Hello';
const substr = str.slice(3);
console.log({ substr });
Code language: JavaScript (javascript)出力
{ substr: 'lo' }Code language: CSS (css)startが負の場合、slice()メソッドはstr.length + startから抽出を開始します。 例えば
const str = 'Hello';
const substr = str.slice(-3);
console.log({ substr });Code language: JavaScript (javascript)出力
{ substr: 'llo' }Code language: CSS (css)startが省略されている場合、undefinedの場合、または数値に変換できない場合、slice()メソッドは文字列の先頭から抽出を開始します。
const str = 'Hello';
const substr = str.slice();
console.log({ substr });
Code language: JavaScript (javascript)出力
{ substr: 'Hello' }Code language: CSS (css)startが文字列の長さ以上の場合、slice()メソッドは空文字列を返します。 例えば
const str = 'Hello';
const substr = str.slice(5);
console.log({ substr });
Code language: JavaScript (javascript)出力
{ substr: '' }Code language: CSS (css)end
endは、slice()メソッドが抽出を終了する前の位置を指定する0ベースのインデックスです。 結果の文字列には、endインデックスの文字は含まれません。 例えば
const str = 'Hello';
const substr = str.slice(0, 2);
console.log({ substr });Code language: JavaScript (javascript)出力
{ substr: 'He' }Code language: CSS (css)endが負の場合、slice()メソッドはそれをstr.length + endとして扱います。 例えば
const str = 'Hello';
const substr = str.slice(0, -2);
// str.length 5
// str.length + end = 5 + (-2) = 3
console.log({ substr });Code language: JavaScript (javascript)endが文字列の長さより大きい場合、slice()メソッドは文字列の最後まで抽出します。 例えば
const str = 'Hello';
const substr = str.slice(2, 6);
console.log({ substr });Code language: JavaScript (javascript)出力
{ substr: 'llo' }Code language: CSS (css)endが省略されている場合、undefinedの場合、または数値に変換できない場合、slice()メソッドも文字列の最後まで抽出します。 例えば
const str = 'Hello';
const substr = str.slice(3);
console.log({ substr });Code language: JavaScript (javascript)出力
{ substr: 'lo' }Code language: CSS (css)endがstartで表される位置より前の位置を表す場合、slice()メソッドは空文字列を返します。 例えば
const str = 'Hello';
const substr = str.slice(3, 2);
console.log({ substr });Code language: JavaScript (javascript)出力
{ substr: '' }Code language: CSS (css)JavaScript String slice() メソッドの実践例
次の例では、slice()メソッドを使用してメールアドレスのローカル部分を取得します。
let email = '[email protected]'
let localPart = email.slice(0,email.indexOf('@'));
console.log(localPart);Code language: JavaScript (javascript)出力
johnCode language: JavaScript (javascript)仕組み
- まず、
indexOf()メソッドを使用して@記号の位置を探します。indexOf()の戻り値は、slice()メソッドの第二引数として使用されます。 - 次に、
slice()メソッドを使用して、文字列の先頭から@記号の手前の文字までを抽出し、メールアドレスのローカル部分を抽出します。
概要
- JavaScript String の
slice()メソッドを使用して、文字列から部分文字列を抽出します。