【JavaScript】「replace」で全ての文字を置換する方法

こんにちは！WEBデザイナーのこたです。

WEB制作で文字を置換したい場面はありませんか？

「あんまりないよ。。」って方ももう少しお付き合いいただきたければと思います。笑

文字を変換する方法は2種類あります。

JavaScriptとPHPでの変換方法がありますが、今回は「JavaScript」での置換方法をご紹介します。

また、注意点もあるので、こちらも合わせてご紹介しますね。

早速参りましょう！

WEB制作で文字を置換する方法

「replace」を使用します。

文字置換といえばPHPでもありますが、形はほぼ同じなので、JavaScript「replace」さえ覚えてしまえば応用でPHPも変換できそうです。

PHPでの文字置換は今回は置いておきます。

const text = "apple";
const result = text.replace( "apple" , "banana");
console.log(result); 

console.log(banana)に変換されます。

全て置換したい場合

上記関数で置換をする場合に気を付ける点があります。

それは先頭の文字しか変換されないという点です。

例えば

const text = "apple apple apple"; 
const result = text.replace( "apple" , "banana"); 
console.log(result); 

//先頭の1つしかbananaに変換されない
console.log(banana apple apple)に変換されます。

このような形に変換されます。

では、全部変換したい場合はどうするか？

それは「正規表現」を使うことです。

const text = "apple apple apple"; 
const result = text.replace( "/apple/g" , "banana"); 
console.log(result); 

//全てbananaに変換される
console.log(banana banana banana)に変換されます。