JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのsubstring()メソッドで部分文字列を取得する方法を徹底解説

JavaScript の substring() メソッドは、2つのインデックス位置の間にある文字列の範囲を取得します。終了インデックスを省略することで、指定した位置から文字列の末尾までの文字を取り出すことも可能です。


部分文字列(サブストリング)とは、大きな文字列の一部を指します。プログラマーは部分文字列を利用することで、文字列から必要なデータだけを抽出できます。

例えば、ユーザーの生年月日を「日」「月」「年」の3つの変数に分割したり、ユーザーの名前から最初の2文字だけを取り出したりすることができます。本ガイドでは、JavaScript における substring の使い方を詳しく解説していきます。

JavaScript の substring メソッドの基本的な使い方

JavaScript の substring() メソッドは、2つのインデックス値の間にある文字列の一部を抽出します。第2引数を指定しない場合は、指定したインデックス番号以降のすべての文字が取得されます。

substring() メソッドは以下の2つの引数を受け取ります。

  • 部分文字列の開始位置
  • 部分文字列の終了位置

このメソッドの構文を見てみましょう。

"test".substring(start, end);

substring() メソッドは文字列の末尾に連結して使用します。動作には start パラメータのみが必須で、end パラメータは省略可能です。

substring メソッドの実例

文字列の末尾までの文字を取得する

ここでは、猫の名前が入った文字列があるとします。名前の最初の2文字を削除して、残りの文字を確認したい場合、substring() メソッドを使って次のように実装できます。

const catName = "Pickles";
const newCatName = catName.substring(2);
console.log(newCatName);

コードの1行目では catName という変数を定義し、値として「Pickles」を代入しています。次に、catName 変数から部分文字列を取得する変数を定義しました。

substring() メソッドの引数として 2 を指定しているため、このメソッドは文字列のインデックス2以降のすべての文字を返します。実行結果は以下の通りです。

ckles

これで、インデックス位置2以降のすべての文字を取得できました。

指定した範囲内の文字を取得する

ある文字から始まり、別の文字で終わる部分文字列を取得したい場合は、substring() に2つの値を渡します。第1引数が開始位置、第2引数が終了位置です。

それでは、猫の名前の最初の3文字を取得してみましょう。

const catName = "Pickles";
const newCatName = catName.substring(0,2);
console.log(newCatName);

上記の例の出力結果は次の通りです。

Pic

この文字列には、インデックス0から2までの範囲のすべての文字が含まれています。重要なポイントとして、JavaScript の文字列はゼロからインデックスが始まることを覚えておきましょう。つまり、文字列の先頭の文字を取得したい場合は、必ず開始位置を0にする必要があります。

最後の1文字を取得する

次に、文字列の最後の文字を取得してみます。substring メソッドでは負のインデックス番号を使用できないため、代わりに length プロパティを使って文字列の長さを調べます。そして、その値を利用して最後の文字を取り出します。

const catName = "Pickles";
const newCatName = catName.substring(catName.length -1, catName.length);
console.log(newCatName);

実行結果は以下の通りです。

s

この例では、catName.length によって文字列の長さ(文字数)を取得し、その値を使って文字列の最後の文字を返しています。

まとめ

JavaScript の substring() メソッドは、2つのインデックス値の間にある文字を返します。終了インデックスを指定しない場合は、指定したインデックス位置以降のすべての文字が返されます。

開発者は substring() メソッドを使って、文字列を複数の部分に分解できます。これは、文字列から特定の情報だけが必要な場合に非常に便利です。

JavaScript のプログラミングについてさらに学びたい方は、初心者向けのチュートリアルガイドもぜひ参考にしてください。

  1. JavaScriptで文字列を検索する方法【search()メソッドの使い方を解説】

    JavaScriptで文字列を検索する方法 JavaScriptで文字列の中から特定の文字列を探すには、search()メソッドを使用します。このメソッドは、引数に渡した文字列(または正規表現)が対象の文字列内で最初に一致した位置(インデックス)を返し、見つからなかった場合は -1 を返します。 以下は、JavaScriptで文字列を検索するサンプルコードです。 サンプルコード <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8" />

  2. 文字列をJavaScriptオブジェクトに変換する方法【JSON.parse()の使い方】

    JavaScriptでJSON形式の文字列をオブジェクトに変換するには、JSON.parse()メソッドを使用します。このメソッドは、引数に渡された文字列を解析(パース)し、対応するJavaScriptオブジェクトを返します。 サンプルコード <!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1.0 /> <title>Docum