文字列の置換 | JavaScript逆引き | Webサイト制作支援

文字列の置換を行うには、string.replaceメソッドを使用します。

構文

string.replace(sub string, rep[, flags]);

または

string.replace(sub string, function[, flags]);

引数名		型	説明
第一引数必須	sub string	string\|RexExp	置換前の文字列または正規表現（検索文字列）
第二引数必須	rep	string\|function	置換後の文字列または置換後に処理する関数
第三引数	flags	string	検索オプション

戻り値

置換された文字列を返します。

サンプルコード

JavaScript

var str = '0123456789abcdefgあいうえお';

// 通常の置換
var result1 = str.replace('123', 'いちにさん');

// 正規表現での置換
var result2 = str.replace(/123(456)/, 'いちにさん$1');

// 関数処理
var result3 = str.replace('abc', function(matchString) {
	// 見つかった文字列を大文字にして戻す
	return matchString.toUpperCase();
});

// 関数処理（正規表現）
var result4 = str.replace(/123(456)(789)/, function(matchAllString, matchFirstString, matchSecondString) {
	return 'あいう';
});

第二引数が関数の場合は、functionの第一引数には検索で一致した全文字列が入ってきます。
functionの第二引数以降は正規表現で指定した場合、グループ指定した分だけ入ってきます。

検索オプション

検索オプションは次の通りです。

フラグ値	説明
g	複数に一致（グループマッチ）
i	大文字小文字の区別を無視
m	複数行を越えた一致（第一引数が文字列である場合のみ）

JavaScript

var str    = '0123456789abcdefgあいうえおABCDEFG',
    result = str.replace('abc', 'いちにさん', 'ig');

alert(result);

複数の文字列を置換

複数の文字列を置換する場合の方法です。

関数定義

JavaScript

/**
 * 複数の文字列を置換
 * @param {string|*[]} searchArr 置換前の文字列または正規表現（検索文字列）の配列
 * @param {string[]} replaceArr 置換後の文字列の配列
 * @param {string} value 置換対象の文字列
 * @param {string} [flags] 検索オプション
 * @return {string} 置換された文字列を返す
 */
var multiReplace = function(searchArr, replaceArr, value[, flags]) {
	if (typeof searchArr !== 'object' || !('length' in searchArr)) return value;
	if (typeof replaceArr !== 'object' || !('length' in replaceArr)) return value;
	if (typeof value !== 'string') return value;
	if (searchArr.length === 0 || replaceArr.length === 0 || value === '') return value;

	for (var i = 0, len = searchArr.length; i < len; i++) {
		if (!searchArr[i] || !replaceArr[i]) continue;

		if (flags) {
			value = value.replace(searchArr[i], replaceArr[i], flags);
		} else {
			value = value.replace(searchArr[i], replaceArr[i]);
		}
	}

	return value;
};

使い方

引数

引数名		型	説明
第一引数必須	searchArr	string \| *[]	置換前の文字列または正規表現（検索文字列）の配列
第二引数必須	replaceArr	string[]	置換後の文字列の配列
第三引数必須	value	string	置換対象の文字列
第四引数	flags	string	検索オプション

戻り値

置換された文字列を返します。

サンプルコード

JavaScript

var str       = '0123456789abcdefgあいうえお',
    searchArr = ['123', 'abc'],
    relaceArr = ['いちにさん', 'えいびーしー'];

var result = multiReplace(searchArr, replaceArr, str);

alert(result);