JavaScript - 文字列のメソッド20と正規表現

JavaScript の文字列に対して使われる20のメソッドをピックアップしました。特定の文字にアクセスする方法や、変更を加えた文字列を作る方法、正規表現を使った高度な検索方法などを、サンプルコードと共に紹介します。

JavaScript - 文字列のメソッド20と正規表現
Photo by Pisit Heng / Unsplash

はじめに:文字列の基本

今回は、複数ある JavaScript の文字列メソッドのうち、20のメソッドについて説明します。

最初に、文字列について簡単に見ておきましょう。文字列とは、シングルクウォート '文字列' 、ダブルクウォート "文字列" 、またはバッククウォート `文字列` で囲まれた、文字のみで構成されたデータのことです。文字列には、前から一つずつ順番にインデックス(番号)がつけられます。インデックスは 0 から始まります。

文字列の例
文字列の例

「インデックス」というワードは、この後メソッドを説明するときにも出てくるので、覚えておいてくださいね。

at(), charAt() - 文字を取得する

at()charAt() は、文字列の中の位置(インデックス)を指定し、その位置にある文字を返すメソッドです。

構文:

文字列.at(インデックス)

文字列.charAt(インデックス)

指定したインデックスの文字にアクセスします。

/* at(), charAt() */
/*** 指定位置の文字にアクセス ***/

const string = 'Pyxofy';

//インデックス0の文字を出力
console.log(string.at(0));     // 'P'
console.log(string.charAt(0)); // 'P'

//インデックス5の文字を出力
console.log(string.at(5));     // 'y'
console.log(string.charAt(5)); // 'y'

at() と charAt() の違い

at()charAt() はどちらも、インデックスを指定して文字列内の文字を取得するメソッドです。二つには次のような違いがあります。

  • 指定したインデックスが範囲外の場合
    • at()undefined を返す
    • charAt():空文字 '' を返す
/*** 指定したインデックスが範囲外の場合 ***/

const string = 'Pyxofy';

//インデックス100の文字を出力
console.log(string.at(100));     // undefined
console.log(string.charAt(100)); // ''
  • マイナスのインデックスを指定した場合
    • at():文字列の末尾から数える(マイナスのインデックスを指定可能)
    • charAt():空文字を返す(マイナスのインデックスを指定不可能)
/*** マイナスのインデックスを指定した場合 ***/

const string = 'Pyxofy';

//マイナスのインデックスを指定できる
console.log(string.at(-1)); // 'y'

//マイナスのインデックスを指定できない
console.log(string.charAt(-1)); // ''

slice(), substring() - 文字列を抽出する

slice()substring() は、指定した範囲の文字列を抽出して、新しい文字列を作るメソッドです。

構文:

文字列.slice(抽出開始位置インデックス)
文字列.slice(抽出開始位置インデックス, 抽出終了位置インデックス)
//終了位置の文字は含まれない

文字列.substring(抽出開始位置インデックス)
文字列.substring(抽出開始位置インデックス, 抽出終了位置インデックス)
//終了位置の文字は含まれない

始まりと終わりのインデックスを指定して文字列を抽出し、新しい文字列を作成します。

/* slice(), substring() */
/*** 指定範囲の文字列を抽出 ***/

const string = 'Welcome to Pyxofy';

//指定範囲の文字列を抽出し、変数に格納
const string1 = string.slice(0, 7);
const string2 = string.substring(0, 7);

//新しく作成した文字列を出力
console.log(string1); // 'Welcome'
console.log(string2); // 'Welcome'

終了位置は省略することができます。その場合は、文字列の末尾までが抽出されます。

/* slice(), substring() */
/*** 開始位置のみ指定 ***/

const string = 'Welcome to Pyxofy';

//インデックス3から末尾までの文字列を抽出し、変数に格納
const string1 = string.slice(3);
const string2 = string.substring(3);

//新しく作成した文字列を出力
console.log(string1); // 'come to Pyxofy'
console.log(string2); // 'come to Pyxofy'

slice() と substring() の違い

slice()substring() はどちらも、インデックスを指定して文字列を取り出し、新しい文字列を作るメソッドです。二つには次のような違いがあります。

  • 開始位置が終了位置より大きい場合
    • slice():空文字 '' を返す
    • substring():二つの引数を入れ替える
/*** 開始位置が終了位置より大きい場合 ***/

const string = 'Welcome to Pyxofy';

//開始位置7が終了位置0より大きい
const string1 = string.slice(7, 0);
const string2 = string.substring(7, 0); //-> (0, 7)

//新しく作成した文字列を出力
console.log(string1); // ''
console.log(string2); // 'Welcome'
  • マイナスのインデックスを指定した場合
    • slice():文字列の末尾から数える
    • substring():0 として扱う
/*** マイナスのインデックスを指定した場合 ***/

const string = 'Welcome to Pyxofy';

//マイナスのインデックス
const string1 = string.slice(-9, -1);
const string2 = string.substring(-9, -3); //-> (0, 0)

//新しく作成した文字列を出力
console.log(string1); // 'to Pyxofy'
console.log(string2); // ''

repeat() - 文字列をコピーして連結する

repeat() は、指定した回数だけ文字列をコピーし、それらを連結した新しい文字列を作るメソッドです。

構文:

文字列.repeat(コピーする回数)

文字列をコピーして連結し、新しい文字列を作成します。

/* repeat() */
/*** 文字列をコピーして連結 ***/

const string = 'JavaScript';

//指定した回数だけ文字列をコピーし、変数に格納
const string1 = string.repeat(0);
const string2 = string.repeat(1);
const string3 = string.repeat(3);

//新しく作成した文字列を出力
console.log(string1); // ''
console.log(string2); // 'JavaScript'
console.log(string3); // 'JavaScriptJavaScriptJavaScript'

concat() - 文字列を連結する

concat() は、文字列を連結して新しい文字列を作るメソッドです。複数の文字列を連結したい場合は、() 内にカンマ , で区切って書きます。

構文:

文字列.concat(連結する文字列)

複数の文字列を連結して、新しい文字列を作成します。

/* concat() */
/*** 複数の文字列を連結 ***/

const string1 = 'HTML';
const string2 = 'CSS';
const string3 = 'JavaScript';

//文字列を連結し、変数に格納
const newString1 = string1.concat(string2, string3);
const newString2 = string1.concat(' ', string2, ' ', string3);

//新しく作成した文字列を出力
console.log(newString1); // 'HTMLCSSJavaScript'
console.log(newString2); // 'HTML CSS JavaScript'

padStart(), padEnd() - 文字列を延長する

padStart()padEnd() は、文字列の長さを延長するメソッドです。文字列の長さを指定し、その長さになるまで特定の文字列を付け加えます。付け加える文字列を指定しない場合は、スペースで延長されます。

二つの違いは次のとおりです。

  • padStart():文字列の「先頭」に付け加える
  • padEnd():文字列の「末尾」に付け加える

構文:

文字列.padStart(最終的な文字列の長さ)
文字列.padStart(最終的な文字列の長さ, 先頭に付け加える文字列)

文字列.padEnd(最終的な文字列の長さ)
文字列.padEnd(最終的な文字列の長さ, 末尾に付け加える文字列)

指定した長さになるまで 'x' を付け足して延長し、新しい文字列を作成します。

/* padStart(), padEnd() */
/*** 文字列を延長 ***/

const string = '12';

//指定した長さになるまで'x'を付け足し、変数に格納
const newString1 = string.padStart(3, 'x');
const newString2 = string.padEnd(5, 'x');

//新しく作成した文字列を出力
console.log(newString1); // 'x12'
console.log(newString2); // '12xxx'

指定した長さになるまで 'abcdefghijklmn' から付け足して延長し、新しい文字列を作成します。

/* padStart(), padEnd() */
/*** 文字列を延長 ***/

const string = '12';

//指定した長さになるまで付け足し、変数に格納
const newString1 = string.padStart(10, 'abcdefghijklmn');
const newString2 = string.padEnd(20, 'abcdefghijklmn');

//新しく作成した文字列を出力
console.log(newString1); // 'abcdefgh12'
console.log(newString2); // '12abcdefghijklmnabcd'

trim(), trimStart(), trimEnd() - 文字列から空白を削除する

trim() は文字列の両端から、trimStart() は文字列の先頭から、trimEnd() は文字列の末尾から空白を削除し、新しい文字列を作るメソッドです。

構文:

文字列.trim()

文字列.trimStart()

文字列.trimEnd()

文字列から空白を削除し、新しい文字列を作成します。

/* trim(), trimStart(), trimEnd() */
/*** 文字列から空白を削除 ***/

const string = ' Welcome to Pyxofy ';

//空白を削除し、変数に格納
const string1 = string.trim();
const string2 = string.trimStart();
const string3 = string.trimEnd();

//新しく作成した文字列を出力
console.log(string1); // 'Welcome to Pyxofy'
console.log(string2); // 'Welcome to Pyxofy '
console.log(string3); // ' Welcome to Pyxofy'

toUpperCase(), toLowerCase() - 大文字/小文字に変換する

toUpperCase() は文字列を大文字に、toLowerCase() は文字列を小文字に変換し、新しい文字列を作るメソッドです。

構文:

文字列.toUpperCase()

文字列.toLowerCase()

文字列を大文字または小文字に変換し、新しい文字列を作成します。

/* toUpperCase(), toLowerCase() */
/*** 大文字または小文字に変換 ***/

const string = 'I like apples.';

//文字列を変換し、変数に格納
const string1 = string.toUpperCase();
const string2 = string.toLowerCase();

//新しく作成した文字列を出力
console.log(string1); // 'I LIKE APPLES.'
console.log(string2); // 'i like apples.'

indexOf(), lastIndexOf(), includes() - 文字列を検索する

indexOf(), lastIndexOf(), includes() は、文字列から特定の文字列を探し出すメソッドです。

三つの違いは次のとおりです。

  • indexOf():「前方から後方へ」文字列を検索し、「最初のインデックス」を返す。見つからない場合は -1 を返す。
  • lastIndexOf():「後方から前方へ」文字列を検索し、「最後のインデックス」を返す(後方からさかのぼって検索するので、見つけるタイミングとしては「最初」、配列内の位置としては「最後」)。見つからない場合は -1 を返す。
  • includes():「前方から後方へ」文字列を検索し、存在する場合は true を、存在しない場合は false を返す。

構文:

文字列.indexOf(検索する文字列)
文字列.indexOf(検索する文字列, 検索開始位置インデックス)
//検索開始位置を指定しない場合は文字列の先頭から検索を開始

文字列.lastIndexOf(検索する文字列)
文字列.lastIndexOf(検索する文字列, 検索開始位置インデックス)
//検索開始位置を指定しない場合は文字列の末尾から検索を開始

文字列.includes(検索する文字列)
文字列.includes(検索する文字列, 検索開始位置インデックス)
//検索開始位置を指定しない場合は文字列の先頭から検索を開始

文字列から 'Java' を検索します。

/* indexOf(), lastIndexOf(), includes() */
/*** 先頭または末尾から検索 ***/

const string = 'JavaScript';

//先頭から検索して最初のインデックスを返す
console.log(string.indexOf('Java'));
// 0

//末尾から検索して最後のインデックスを返す
console.log(string.lastIndexOf('Java'));
// 0

//先頭から検索して論理値を返す
console.log(string.includes('Java'));
// true

インデックス 2 の位置から 'a' の検索を開始します。

/* indexOf(), lastIndexOf(), includes() */
/*** 開始位置を指定して検索 ***/

const string = 'JavaScript';

//後方へ検索して最初のインデックスを返す
console.log(string.indexOf('a', 2));
// 3

//前方へ検索して最後のインデックスを返す
console.log(string.lastIndexOf('a', 2));
// 1

//後方へ検索して論理値を返す
console.log(string.includes('a', 2));
// true

検索開始位置にマイナスのインデックスを指定した場合は、0 として扱われます。

/* indexOf(), lastIndexOf(), includes() */
/*** 検索開始位置にマイナスのインデックスを指定 ***/

const string = 'JavaScript';

//後方へ検索して最初のインデックスを返す
console.log(string.indexOf('a', -5)); //-> ('a', 0)
// 1

//前方へ検索して最後のインデックスを返す
console.log(string.lastIndexOf('a', -5)); //-> ('a', 0)
// -1 (0の位置から前方へ検索しても見つからない)

//後方へ検索して論理値を返す
console.log(string.includes('a', -5)); //-> ('a', 0)
// true

検索開始位置が文字列の長さより大きい場合は、lastIndexOf() メソッドのみが検索可能です。また、大文字と小文字は区別されます。

/* indexOf(), lastIndexOf(), includes() */
/*** 検索開始位置が文字列の長さより大きい場合 ***/
/*** 大文字小文字の区別あり ***/

const string = 'JavaScript';

//検索範囲外
console.log(string.indexOf('Script', 20));
// -1

//検索可能
console.log(string.lastIndexOf('Script', 20));
// 4

//大文字小文字は区別される
console.log(string.includes('script'));
// false

正規表現を使用するメソッド

ここからは、() 内に正規表現を使用する文字列のメソッドを紹介します。メソッドについて解説していく前に、正規表現について簡単に説明しておきますね。

正規表現とは

正規表現(Regular Expressions, regexp)とは、文字列を検索したり置換したりするために利用される方法です。検索するための「パターン」と、任意で追加される「フラグ」で構成されます。

構文:

const regexp = /パターン/フラグ;

正規表現の簡単な例を見てみましょう。スラッシュの間に 'apple' と書くと、文字列の中で 'apple' というパターンと一致する部分を探すことができます。つまりこの場合は、'apple' という文字列を検索できるようになる、ということです。

const regexp = /apple/;

これにフラグを追加してみます。下の例では、i の部分がフラグです。

const regexp = /apple/i;

こうすると、'apple' だけでなく、'Apple' や 'APPLE' も検索できるようになります。フラグ i をつけることで、大文字小文字の区別がなくなるのです。

フラグには色々なものがありますが、今回は以下二つのフラグを使用してメソッドを解説していきます。

  • i(ignoreCase):大文字小文字を区別しないで検索する
  • g(global):一致したすべての検索結果を返す

特殊文字とは

正規表現では、スラッシュの間に 'apple' のような単純な文字列パターンではなく、特殊文字を使うことでより高度な検索や置換を行うことができます。

以下の正規表現は、特殊文字を使ってパターンを作成しています。何を意味しているか分かりますか?

const regexp = /\d{3}-\d{4}-\d{4}/;

正解は、電話番号です。上の正規表現を使用すると、「090-1234-5678」や「080-9876-5432」など、「数字3桁、ハイフン、数字4桁、ハイフン、数字4桁」パターンの文字列を検索できるようになるのです。

特殊文字には色々なものがありますが、今回は以下四つの特殊文字を使用してメソッドを解説していきます。

  • {}:繰り返しの回数を指定する
  • []:角括弧内に指定したいずれか一文字に一致するパターンを作成する
  • \s:ホワイトスペースを意味する
  • |:「または」を意味する

(正規表現の詳細はこちら、特殊文字の詳細はこちらを参照してください)

search() - 正規表現と一致する位置を検索する

search() は、特定のパターンの文字列を探し出すメソッドです。正規表現との一致が存在する場合は、その最初のインデックスを返します。見つからない場合は -1 を返します。

構文:

文字列.search(正規表現)
//引数が単純な文字列である場合は、暗黙的に正規表現に変換される

/S{2}/:'S' が2回繰り返されているパターンを探し、その最初のインデックスを返します。

/* search() */
/*** /S{2}/ を検索 ***/

const string = 'HTML, CSS and JavaScript';

//正規表現:「S二つ」
const regexp = /S{2}/;

//パターンと一致する最初のインデックスを出力
console.log(string.search(regexp));
// 7

/[a-e]/:'a' 〜 'e' を探し、いずれかに一致する最初のインデックスを返します。

/* search() */
/*** /[a-e]/ を検索 ***/

const string = 'HTML, CSS and JavaScript';

//正規表現:「abcdeのどれか」
const regexp = /[a-e]/;

//パターンと一致する最初のインデックスを出力
console.log(string.search(regexp));
// 10

search() と indexOf() の違い

search()indexOf() はどちらも、特定の文字列を探し出して、その最初のインデックスを返すメソッドです。二つには次のような違いがあります。

  • search():検索開始位置を指定できない
  • indexOf():正規表現での検索はできない

match() - 正規表現と一致する文字列を検索する

match() は、特定のパターンの文字列を探し出すメソッドです。正規表現との一致が存在する場合は、その文字列を含んだ配列を返します。見つからない場合は null を返します。

構文:

文字列.match(正規表現)
//引数が単純な文字列である場合は、暗黙的に正規表現に変換される

match() メソッドは、フラグ g があるかないかで結果が変わります。

フラグ g なし

/Java/:フラグ g なしでは、マッチする「最初」の文字列を配列で返します。

/* match() */
/*** /Java/ を検索 ***/

const string = 'JavaScript or Java';

//正規表現:gフラグなし
const regexp = /Java/;

//パターンと一致する最初の文字列を出力
console.log(string.match(regexp));
// ['Java']

フラグ g なしの場合の結果は、マッチした部分の追加情報を含みます。

  • index プロパティ:一致した位置
  • inputプロパティ:検索対象となっている文字列
/*** マッチした部分の追加情報 ***/

const string = 'JavaScript or Java';

//正規表現:gフラグなし
const regexp = /Java/;

//index:一致した文字列のインデックス
console.log(string.match(regexp).index);
// 0

//input:検索対象文字列
console.log(string.match(regexp).input);
// 'JavaScript or Java'

フラグ g あり

/Java/g:フラグ g ありでは、マッチする「すべて」の文字列を配列で返します。

/* match() */
/*** /Java/g を検索 ***/

const string = 'JavaScript or Java';

//正規表現:gフラグあり
const regexp = /Java/g;

//パターンと一致するすべての文字列を出力
console.log(string.match(regexp));
// ['Java', 'Java']

フラグ g ありの場合の結果は、マッチした部分の追加情報は含みません。

match() と search() の違い

match()search() はどちらも、文字列から正規表現のパターンを探し出すメソッドです。二つには次のような違いがあります。

  • match():一致した文字列を配列で返す(g フラグ付きですべての一致を返す)。見つからない場合は null
  • search():一致した最初のインデックスを返す(g フラグは機能しない)。見つからない場合は -1

replace() - 正規表現と一致する文字列を置き換える

replace() は、特定のパターンをほかの文字列に置き換えるメソッドです。正規表現または文字列との一致を探し出して、指定した文字列に置き換えた新しい文字列を返します。

構文:

文字列.replace(正規表現または文字列, 置換する文字列または関数)

replace() メソッドは、一致する部分を探すためのパターンに、正規表現ではなく単純な文字列を指定することもできますよ。下の例では、ハイフンを探してコロンで置き換えます。

/*** 正規表現ではなく文字列で検索して置換 ***/

const string = '10-36-59';

//'-'と一致する最初の文字列を':'に置換
const newString = string.replace('-', ':');

//新しく作成した文字列を出力
console.log(newString);
// '10:36-59'

上の例でも分かるように、文字列で検索した場合、置換されるのは最初に一致した文字列だけです。パターンと一致するすべての部分を置き換えたい場合は、正規表現を使用してフラグ g を付け加えましょう。

フラグ g あり

/-/g:ハイフンと一致する「すべて」の文字列をコロンに置き換えます。

/* replace() */
/*** /-/g を検索して置換 ***/

const string = '10-36-59';

//パターンと一致するすべての文字列を':'に置換
const newString = string.replace(/-/g, ':');

//新しく作成した文字列を出力
console.log(newString);
// '10:36:59'

フラグは複数合わせて付け加えることができます。下の例では、フラグ gi をつけて、「大文字小文字を区別せずに」パターンを検索し、一致する「すべて」の文字列を置換します。

/apples/gi:大小文字を区別せずに 'apples' を探し、一致するすべての文字列を 'APPLES' に置き換えます。

/* replace() */
/*** /apples/gi を検索して置換 ***/

const string = 'Apples are my favorite. I eat two apples every day.';

//パターンと一致するすべての文字列を'APPLES'に置換
const newString = string.replace(/apples/gi, 'APPLES');

//新しく作成した文字列を出力
console.log(newString);
// 'APPLES are my favorite. I eat two APPLES every day.'

関数の結果で置き換える

新しく置き換える文字列には、関数を指定することができます。パターンの一致を見つけると関数が呼び出され、その結果が置換文字列となります。

/happy|lucky/gi:大小文字を区別せずに 'happy' または 'lucky' を探し、一致するすべての文字列を、「2回コピーして連結した文字列」に置き換えます。

/* replace() */
/*** /happy|lucky/gi を検索して関数の戻り値で置換 ***/

const string = 'Happy, Lucky';

//正規表現
const regexp = /happy|lucky/gi;

//パターンを探して関数を呼び出し、その結果で置換
const newString = string.replace(regexp, function(match) {
  return match.repeat(2);
});

//新しく作成した文字列を出力
console.log(newString);
// 'HappyHappy, LuckyLucky'

split() - 文字列を正規表現で分割する

split() は、特定のパターンを区切り文字として、文字列を分割するメソッドです。分割された文字列を含んだ配列を返します。区切り文字となる部分は、結果には含まれません。

構文:

文字列.split()
文字列.split(正規表現または文字列)
文字列.split(正規表現または文字列, 分割する数)

() に引数を指定しない場合は、そのままの文字列が一つの要素となって配列で返されます。

/* split() */
/*** 引数なし ***/

const string = 'I scream, you scream, we all scream for ice cream';

//区切り文字なし
const newArray = string.split();

//新しく作成した配列を出力
console.log(newArray);
// ['I scream, you scream, we all scream for ice cream']

split() メソッドは、区切り文字のパターンに、正規表現ではなく単純な文字列を指定することもできますよ。下の例では、「カンマと空白」を区切り文字として文字列を分割します。

/* split() */
/*** カンマと空白を区切り文字として分割 ***/

const string = 'I scream, you scream, we all scream for ice cream';

//区切り文字:カンマと空白
const newArray = string.split(', ');

//新しく作成した配列を出力
console.log(newArray);
// ['I scream', 'you scream', 'we all scream for ice cream']

例えば、上の文字列を単語ごとに分割したい場合はどうすれば良いでしょうか?「カンマと空白」のほかに、「空白だけ」の部分でも分割されるようにすればいいですね。このような場合に便利なのが、正規表現です。| を使用し、区切り文字を二つのパターンで指定します。

/\s|,\s/:「空白」または「カンマと空白」で文字列を分割します。

/* split() */
/*** /\s|,\s/ を区切り文字として分割 ***/

const string = 'I scream, you scream, we all scream for ice cream';

//区切り文字:正規表現「空白またはカンマと空白」
const newArray = string.split(/\s|,\s/);

//新しく作成した配列を出力
console.log(newArray);
// ['I', 'scream', 'you', 'scream', 'we', 'all', 'scream', 'for', 'ice', 'cream']

第二引数では、配列に含める数を制限することができます。指定した分だけ配列に格納されると、文字列の分割は終了します。下の例では、制限数を 4 として、残りの文字列は配列に含みません。

/* split() */
/*** 分割して配列に含む制限数4 ***/

const string = 'I scream, you scream, we all scream for ice cream';

//区切り文字:正規表現「空白またはカンマと空白」
const newArray = string.split(/\s|,\s/, 4);

//新しく作成した配列を出力
console.log(newArray);
// ['I', 'scream', 'you', 'scream']

split() は、「文字列を分割して配列にする」メソッドです。これとは逆に、「配列を連結して文字列にする」メソッドに join() があります。これは配列に対して使用するメソッドです。こちらで解説しているので、合わせて参考にしてください。

JavaScript - 配列のメソッド20
JavaScript の配列を操作する際によく使われる20のメソッドをピックアップしました。要素の追加、削除、コピー、並べ替え、検索、find(), filter(), map(), forEach() などを、サンプルコードと共に紹介します。

まとめ

ここまで、JavaScript の文字列に使用される20のメソッドを説明してきました。以下は、今回紹介したメソッドの一覧です。

文字へのアクセス

  • at/charAt(インデックス):指定した位置にある文字列を取得

変更を加えた新しい文字列を作成

  • slice/substring(①開始位置, ②終了位置):①から②までを抽出した新しい文字列を作成(②は含まない)
  • repeat(回数):指定した回数コピーして連結した新しい文字列を作成
  • concat(文字列):文字列を連結した新しい文字列を作成
  • padStart/padEnd(①長さ, ②延長文字列):①になるまで先頭/末尾に②を付け加えた新しい文字列を作成
  • trim/trimStart/trimEnd():両端/先頭/末尾のホワイトスペースを削除した新しい文字列を作成
  • toUpperCase/toLowerCase():大文字/小文字に変換した新しい文字列を作成
  • replace(①正規表現または文字列, ②置換文字列または関数):①に一致する文字列を②で置き換えた新しい文字列を作成

文字列の検索

  • indexOf/lastIndexOf(①検索文字列, ②検索開始位置):②から後方/前方へ①を検索し、最初/最後のインデックスを返す
  • includes(①検索文字列, ②検索開始位置):②から後方へ①を検索し、true または false を返す
  • search(正規表現):パターンを検索し、一致した最初のインデックスを返す
  • match(正規表現):パターンを検索し、一致した文字列を含んだ配列を返す

文字列の分割

  • split(①正規表現または文字列, ②分割数):①に一致する文字列で分割し、②の数だけ含んだ配列を返す

これらの他にも文字列のメソッドは複数あります。詳細はこちらを参照してください。

最後まで読んでいただき、ありがとうございます。この記事をシェアしてくれると嬉しいです!

SNSで Pyxofy とつながりましょう! LinkedInThreadsMastodon X (Twitter) @pyxofyFacebook

関連記事

JavaScript - タイプライター風に一文字ずつ表示する方法
キーボードで入力しているかのようなタイピングアニメーションを JavaScript で作ります。左から一文字ずつ順番に表示したあとで、今度は右から一文字ずつ削除するようコーディングします。
CSS Art - How to Make a Simple House
Let’s make a simple house using CSS and HTML. We’ll break down the house into basic shapes. Step by step guide, showing you how to make CSS Art.
CSS Animation – Jumping Box with @property – Part 1
You can make an orange-colored 3D-ish box jump up and down with CSS. Learn how to make this animation in this step-by-step article.
スクラッチプログラミング - パックマンみたいなゲームのつくりかた - Part 1
パックマンがたべるドットをきれいにならべるプログラムを紹介(しょうかい)します。迷路(めいろ)の背景(はいけい)をつくって、通路(つうろ)に等間隔(とうかんかく)でドットを表示(ひょうじ)しましょう。