本記事では、JavaScriptで指定した文字を別の文字に置き換える方法について解説しています。
JavaScriptの学習におすすめ書籍
1冊ですべて身につくJavaScript入門講座

メリット
- 誰でも分かるように嚙み砕いて説明してくれる
- アニメーションの知識が深く学べる
- 1つのWebサイトを作りながら学べる


Amazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ!



初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね!
全プログラマー必見!
変数名/関数名にもう悩まない!
変数名/関数名にもう悩まない!
リーダブルコード


メリット
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
著:Dustin Boswell, 著:Trevor Foucher, 解説:須藤 功平, 翻訳:角 征典
¥2,640 (2023/07/23 02:48時点 | Amazon調べ)


目次
最初に一致した文字のみ置き換える
最初に一致した文字のみ置き換えたい場合は、replaceメソッドを使用します。基本的な使い方は以下のとおりです。
String.replace(searchValue ,replaceValue)
構文解説
- String:元の文字列
- searchValue:置換前の文字列
- replaceValue:置換後の文字列



replaceメソッドを使用したサンプルコードを用意したので、確認してみましょう!
let str = "打しゃ 走しゃ 勝しゃ 走者一掃";
console.log(str.replace("しゃ", "者")); // => 打者 走しゃ 勝しゃ 走者一掃
上記のコードは、変数strに代入されている文字列の「しゃ」の文字を「者」に置き換えます。一番初めの打しゃが打者に置き換わっていますが、2番目以降の走しゃ・勝しゃは置き換わっていないことが確認できます。
一致した全ての文字を置き換える
一致した全ての文字を置き換えたい場合は、replaceAllメソッドを使用します。基本的な使い方は以下のとおりです。
String.replaceAll(searchValue ,replaceValue)
構文解説
- String:元の文字列
- searchValue:置換前の文字列
- replaceValue:置換後の文字列



replaceメソッドで使用したサンプルコードを、replaceAllメソッドに書き換えてみましょう!
let str = "打しゃ 走しゃ 勝しゃ 走者一掃";
console.log(str.replaceAll("しゃ", "者")); // => 打者 走者 勝者 走者一掃
replaceメソッドの時に置換されなかった、走しゃ・勝しゃの文字列が走者・勝者に置換されていることが確認できます。