JavaScript

JavaScriptで文字列を置換する方法

arage.com@gmail.com

JavaScriptのreplaceメソッドは文字列操作に非常に便利な機能の一つで、文字列内の特定のパターンを新しいパターンに置き換えることができます。

replaceメソッドの詳細

replaceメソッドの基本的な構文

replaceメソッドの基本的な構文は次のようになります。

1str.replace(regexp|substr, newSubStr|function)
  • regexp|substr
    • 置き換えるパターン(正規表現または文字列)を指定します。
  • newSubStr|function
    • 新しい部分文字列、または置き換えを行うための関数を指定します。

replaceメソッドの引数について

replaceメソッドの第二引数に関数を指定すると、より高度な置換が可能になります。この関数は、マッチした結果に基づいて動的に新しい文字列を生成します。

1let str = "It is 15 degrees outside.";
2str = str.replace(/\d+/, (match) => parseInt(match) * 1.8 + 32);
3console.log(str); // "It is 59 degrees outside."

正規表現とreplaceメソッド

正規表現を使用したreplaceの基本的な方法

replaceメソッドは正規表現と組み合わせて使うことで、より複雑な置換を行うことができます。

1let str = "I love cats, I love dogs.";
2str = str.replace(/dogs|cats/g, "animals");
3console.log(str); // "I love animals, I love animals."

この例では、正規表現 /dogs|cats/g を使用して、”dogs” または “cats” を含むすべてのインスタンスを “animals” に置き換えています。

正規表現を使用したreplaceの応用例

replaceメソッドと正規表現を組み合わせることで、文字列の特定のパターンを捉えて操作することが可能です。以下に例を示します。

1let str = "I have 3 cats and 4 dogs.";
2str = str.replace(/(\d+) (cats|dogs)/g, (match, p1, p2) => `${p1} ${p2 === 'cats' ? 'kittens' : 'puppies'}`);
3console.log(str); // "I have 3 kittens and 4 puppies."

この例では、数字と “cats” または “dogs” の組み合わせを、数字と “kittens” または “puppies” に置き換えています。

文字列内のすべての出現箇所を置換する方法

replaceメソッドで全ての出現箇所を置換する方法

replaceメソッドはデフォルトで最初にマッチした出現箇所のみを置き換えます。しかし、正規表現の g フラグ(グローバル検索)を使用することで、全てのマッチした出現箇所を置き換えることが可能です。

1let str = "I love cats, I love cats, I love cats.";
2str = str.replace(/cats/g, "dogs");
3console.log(str); // "I love dogs, I love dogs, I love dogs."

replaceAllメソッドの使用方法

また、すべてのインスタンスを置き換えるためには、replaceAllメソッドを使用することもできます。このメソッドは、文字列内のすべてのインスタンスを置き換えます。

1let str = "I love cats, I love cats, I love cats.";
2str = str.replaceAll("cats", "dogs");
3console.log(str); // "I love dogs, I love dogs, I love dogs."

まとめと次のステップ

replaceメソッドの重要性と活用方法

JavaScriptのreplaceメソッドは、文字列操作において非常に強力なツールです。単純な文字列の置換から、正規表現を使用した複雑な置換まで、様々なケースで使用することができます。

JavaScriptでの文字列操作の次のステップ

replaceメソッドをマスターすれば、JavaScriptでの文字列操作がより柔軟かつ強力になります。次のステップでは、他の文字列操作メソッド(substring, split, concatなど)を学んだり、replaceメソッドを使用したより高度な操作に挑戦したりすることをお勧めします。

記事URLをコピーしました