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

JavaScriptのsubstr()とsubstring()の違いとは？引数の意味と使い方を解説

JavaScriptには文字列の一部を切り出すためのメソッドが複数用意されています。その代表格がsubstr()とsubstring()です。この2つは一見同じように見え、場合によっては同じ結果を返しますが、メソッドの考え方も引数の意味もまったく異なります。

substr()とsubstring()の決定的な違い

2つのメソッドの違いは、第2引数の扱いにあります。

  • substring() … 第1引数に開始インデックス、第2引数に「切り出しを終了するインデックス」を指定します。終了位置の文字は結果に含まれません。
  • substr() … 第1引数に開始インデックス、第2引数に「返す文字列の最大長（文字数）」を指定します。

さらに、負の値の扱いも異なる点に注意しましょう。substr()は負の数を渡すと「文字列の末尾から数えた位置」として解釈しますが、substring()は負の数をすべて0として扱います。

substr()メソッドのサンプルコード

まずはJavaScriptのsubstr()メソッドを使った例を見てみましょう。

<html>
   <head>
      <title>JavaScript String substr() Method</title>
   </head>

   <body>
      <script>
         var str = "Apples are round, and apples are juicy.";
         document.write("(1,2): " + str.substr(1,2));
         document.write("<br />(-2,2): " + str.substr(-2,2));
         document.write("<br />(1): " + str.substr(1));
         document.write("<br />(-20, 2): " + str.substr(-20,2));
         document.write("<br />(20, 2): " + str.substr(20,2));
      </script>
   </body>
</html>

実行結果は次のようになります。

(1,2): pp
(-2,2): y.
(1): pples are round, and apples are juicy.
(-20, 2): nd
(20, 2): d

substring()メソッドのサンプルコード

続いて、substring()メソッドの例です。

<html>
   <head>
      <title>JavaScript String substring() Method</title>
   </head>

   <body>
      <script>
         var str = "Apples are round, and apples are juicy.";
         document.write("(1,2): " + str.substring(1,2));
         document.write("<br />(0,10): " + str.substring(0, 10));
         document.write("<br />(5): " + str.substring(5));
      </script>
   </body>
</html>

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

(1,2): p
(0,10): Apples are
(5): s are round, and apples are juicy.

補足：新規コードではsubstr()の使用は非推奨

substr()は現在のECMAScript仕様では、後方互換性のために残されている付録（Annex B）のレガシー機能に分類されています。今後のコーディングでは、slice()やsubstring()の使用が推奨されます。特にslice()はsubstr()と同様に負のインデックスをサポートしているため、既存コードからの置き換えもスムーズに行えるでしょう。

  1. JavaScriptにおける関数とメソッドの違いとは？わかりやすく解説

    JavaScriptにおいて、関数とメソッドは本質的には同じものです。両者の違いは、メソッドがオブジェクトのプロパティとして定義された関数であるという点にあります。つまり、独立して定義されたものを「関数」、オブジェクトに紐づけられたものを「メソッド」と呼びます。 JavaScriptの関数の基本形 まず、一般的な関数の定義方法を見てみましょう。 function functionname(param1, param2){ // 処理内容 } JavaScriptのメソッドの例 メソッドは、オブジェクトに関連付けられた関数です。次の例では、employeeオブジェクトの中にdetails

  2. JavaとJavaScriptの違いとは？歴史・技術・使い分けを徹底解説

    ウェブ開発者のジェレミー・キースは2009年、「JavaとJavaScriptの関係は、ハムとハムスターの関係のようなものだ」と語りました。この比喩がどれほど正確かは議論の余地がありますが、その本質は的確です。共通する言語的ルーツを持つにもかかわらず、JavaとJavaScriptはまったく異なる2つのプログラミング言語なのです。年月とともに両者の重なりも多少増えましたが、今なおJavaScriptはウェブサイトにインタラクティブ性をもたらすフロントエンド言語の主流であり続け、Javaはサーバーサイドやアプリケーション開発で人気を保っています。開発者を採用したい方、プログラミングを学びたい方