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

JavaScriptのslice()メソッドとは？文字列の切り出し方法をわかりやすく解説

JavaScriptで文字列の一部を取り出したいときに便利なのが、slice()メソッドです。この記事では、slice()メソッドの基本的な使い方から具体的なコード例まで、初心者にもわかりやすく解説します。

slice()メソッドとは

slice()メソッドは、文字列の一部を切り取って抽出し、その部分を新しい文字列として返すメソッドです。元の文字列は変更されず、そのまま保持される点が大きな特徴です。

基本構文

slice()メソッドは、「開始インデックス」と「終了インデックス」の2つの引数を受け取ります。記述方法は以下の通りです。

string.slice(開始インデックス, 終了インデックス)

引数の説明

a) 開始インデックス： 文字列の抽出を開始する位置（インデックス番号）を指定します。

b) 終了インデックス： 文字列の抽出を終了する位置の直前（このインデックスの手前まで）を指定します。つまり、終了インデックス自体は含まれません。

サンプルコード1：開始・終了インデックスを指定する場合

次の例では、slice()メソッドを使って、文字列の18番目から27番目（27-1=26）までを切り出し、「Neuralink」を出力します。

<html>
<body>
<p id="slice"></p>
<script>
    var string = "Tesla, Solarcity, Neuralink, Spacex";
    var newstring = string.slice(18, 27);
    document.getElementById("slice").innerHTML = newstring;
</script>
</body>
</html>

実行結果

Neuralink

インデックスは0から数え始めるため、18番目の「N」から26番目の「k」までが抽出され、新しい文字列として返されます。

サンプルコード2：開始インデックスのみ指定する場合

引数として開始インデックスだけを指定した場合、slice()メソッドはその位置から文字列の末尾まですべてを切り出して表示します。

次の例では、開始インデックス（18）のみを指定しているため、その位置以降の文字列全体が出力されます。

<html>
<body>
<p id="slice"></p>
<script>
    var string = "Tesla, Solarcity, Neuralink, Spacex";
    var newstring = string.slice(18);
    document.getElementById("slice").innerHTML = newstring;
</script>
</body>
</html>

実行結果

Neuralink, Spacex

補足：負のインデックスも使える

slice()メソッドでは、負の値を指定することも可能です。負の値を指定すると、文字列の末尾から数えた位置として扱われます。例えば「string.slice(-6)」とすれば、末尾から6文字分の文字列を取得できます。この柔軟な指定方法により、さまざまな場面で文字列操作が簡単に行えます。

  1. JavaScriptのtest()メソッドとは？使い方をサンプル付きで解説

    JavaScriptのtest()メソッドは、正規表現（RegExp）に属するメソッドの一つです。対象となる文字列の中に、指定したパターンが存在するかどうかを検索し、その結果に応じてtrueまたはfalseのブール値を返します。パターンが見つかればtrue、見つからなければfalseとなります。また、test()メソッドは大文字と小文字を区別するという重要な特徴を持っています。ここでは、実際のコード例を使いながら、test()メソッドの使い方を詳しく見ていきましょう。 基本構文 test()メソッドは、以下のように正規表現リテラルに対して呼び出して使用します。 /パターン/.test(検索対象

  2. JavaScriptのWeakMapでclear()メソッドを使う方法とは？

    WeakMapのclear()メソッドとはWeakMapオブジェクトのclear()メソッドは、そのWeakMapに格納されているすべてのキーと値のペアを一括で削除するためのメソッドです。しかし、このメソッドは現在のECMAScriptの仕様からは削除されています。そのため、標準のWeakMapに対して直接clear()を呼び出すことはできません。とはいえ、WeakMapオブジェクトをラップするクラスを作成し、clear()メソッドに対応した処理を追加することで、同様の機能を簡単に実現できます。実装例：clear()メソッドを持つWeakMapラッパークラスclass ClearableWea