Movatterモバイル変換


[0]ホーム

URL:


  1. 開発者向けのウェブ技術
  2. JavaScript
  3. JavaScript リファレンス
  4. 標準組み込みオブジェクト
  5. String
  6. substring()

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。

View in EnglishAlways switch to English

String.prototype.substring()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

substring()String 値のメソッドで、文字列の一部、開始インデックスから終了インデックスの手前まで、または終了インデックスが指定されなかった場合は文字列の最後までを返します。

試してみましょう

const str = "Mozilla";console.log(str.substring(1, 3));// 予想される結果: "oz"console.log(str.substring(2));// 予想される結果: "zilla"

構文

js
substring(indexStart)substring(indexStart, indexEnd)

引数

indexStart

返される部分文字列に含まれる、最初の文字の位置です。

indexEnd省略可

返される部分文字列から除外される、最初の文字の位置です。

返値

与えられた文字列から抽出された区間を含む新しい文字列です。

解説

substring()indexStart からindexEnd の直前までの文字を取り出します。特に、

  • indexEnd が省略されたりundefined であったりした場合、substring() は文字列の最後までの文字を取り出します。
  • indexStartindexEnd と等しい場合、substring() は空の文字列を返します。
  • indexStartindexEnd より大きかった場合、substring() は 2 つの引数が交換されたものとして実行されます。下記の例をご覧ください。

引数が0 未満、またはstringName.length を超えた場合、それはそれぞれ0stringName.length として扱われます。

いずれかの引数がNaN の場合、それは0 として扱われます。

substring() の使用

以下の例ではsubstring() を使用して、"Mozilla" という文字列から文字を取り出して表示します。

js
const anyString = "Mozilla";console.log(anyString.substring(0, 1)); // "M"console.log(anyString.substring(1, 0)); // "M"console.log(anyString.substring(0, 6)); // "Mozill"console.log(anyString.substring(4)); // "lla"console.log(anyString.substring(4, 7)); // "lla"console.log(anyString.substring(7, 4)); // "lla"console.log(anyString.substring(0, 7)); // "Mozilla"console.log(anyString.substring(0, 10)); // "Mozilla"

substring() と length プロパティの使用

次の例ではsubstring() メソッドとlength プロパティを使用して、特定の文字列の最後の文字を抜き出しています。この方法では、上記の例と同じようあなたが最初と最後の位置を知っている必要がないこと考えると、覚えやすいかもしれません。

js
const text = "Mozilla";// 文字列の最後の 4 文字を取るconsole.log(text.substring(text.length - 4)); // "illa" と表示// 文字列の最後の 5 文字を取るconsole.log(text.substring(text.length - 5)); // "zilla" と表示

substring() と substr() の違い

substring() メソッドとsubstr() メソッドとの間には微妙な違いがあるので、混乱しないように注意してください。

  • substr() の 2 つの引数はstart およびlength であるのに対し、substring() の場合はstart およびend です。
  • substr()start インデックスは負の数の場合に文字列の末尾から逆に進むのに対し、substring()0 に丸められます。
  • substr() で負の長さを指定すると 0 と見なされますが、substring()endstart よりも小さい場合は 2 つのインデックスが交換されます。

さらに、substr() は ECMAScript の古い機能とみなされており、将来のバージョンでは削除される可能性があるため、できれば使用しないのが最良です。

js
const text = "Mozilla";console.log(text.substring(2, 5)); // "zil"console.log(text.substr(2, 3)); // "zil"

substring() と slice() の違い

substring() メソッドとslice() メソッドはほぼ同じですが、特に負の数の引数の扱いについて、いくつかの微妙な違いがあります。

substring() メソッドはindexStartindexEnd よりも大きい場合に 2 つの引数を交換するので、文字列が返されます。slice() メソッドはこの場合には空文字列を返します。

js
const text = "Mozilla";console.log(text.substring(5, 2)); // "zil"console.log(text.slice(5, 2)); // ""

どちらかまたは両方の引数が負の数またはNaN であった場合、substring() メソッドはこれらを0 として扱います。

js
console.log(text.substring(-5, 2)); // "Mo"console.log(text.substring(-5, -2)); // ""

slice()NaN の引数を0 として扱いますが、負の数を指定した場合は、文字列の末尾からの文字数で位置を探します。

js
console.log(text.slice(-5, 2)); // ""console.log(text.slice(-5, -2)); // "zil"

負の数を使用した例はslice() のページをご覧ください。

文字列内の部分文字列の置き換え

次の例は、文字列内の部分文字列を置き換えます。これは単独の文字と部分文字列の両方を置き換えます。この例の最後にある関数呼び出しは、元の文字列Brave New World から文字列Brave New Web を生成します。

js
// fullS という文字列内で oldS を newS に置き換えます。function replaceString(oldS, newS, fullS) {  for (let i = 0; i < fullS.length; ++i) {    if (fullS.substring(i, i + oldS.length) === oldS) {      fullS =        fullS.substring(0, i) +        newS +        fullS.substring(i + oldS.length, fullS.length);    }  }  return fullS;}replaceString("World", "Web", "Brave New World");

なお、これはoldSnewS の部分文字列である場合に無限ループに陥ります。 — 例えば、"World""OtherWorld" で置き換える場合などです。

置き換えるのにより良い方法は以下の通りです。

js
function replaceString(oldS, newS, fullS) {  return fullS.split(oldS).join(newS);}

上述のコードは、 substring の操作の例を提供します。部分文字列を置き換える必要があるとき、多くの場合String.prototype.replace() を使用します。

仕様書

Specification
ECMAScript® 2026 Language Specification
# sec-string.prototype.substring

ブラウザーの互換性

関連情報

Help improve MDN

Learn how to contribute

This page was last modified on byMDN contributors.


[8]ページ先頭

©2009-2025 Movatter.jp