将多个字符串替换为多个其他字符串

我正在尝试用多个其他单词替换字符串中的多个单词。该字符串是“我有一只猫、一只狗和一只山羊”。

然而，这不会产生“我有一只狗、一只山羊和一只猫”，而是产生“我有一只猫、一只猫和一只猫”。在JavaScript中是否可以同时用多个其他字符串替换多个字符串，从而产生正确的结果？

var str = "I have a cat, a dog, and a goat.";
str = str.replace(/cat/gi, "dog");
str = str.replace(/dog/gi, "goat");
str = str.replace(/goat/gi, "cat");

//this produces "I have a cat, a cat, and a cat"
//but I wanted to produce the string "I have a dog, a goat, and a cat".

具体解决方案

您可以使用一个函数来替换每一个。

var str = "I have a cat, a dog, and a goat.";
var mapObj = {
   cat:"dog",
   dog:"goat",
   goat:"cat"
};
str = str.replace(/cat|dog|goat/gi, function(matched){
  return mapObj[matched];
});

jsfiddle 示例

概括它

如果您想动态维护正则表达式并将未来的交换添加到地图中，您可以这样做

new RegExp(Object.keys(mapObj).join("|"),"gi"); 

生成正则表达式。那么它看起来就像这样

var mapObj = {cat:"dog",dog:"goat",goat:"cat"};

var re = new RegExp(Object.keys(mapObj).join("|"),"gi");
str = str.replace(re, function(matched){
  return mapObj[matched];
});

要添加或更改更多替代品，您只需编辑地图即可。

摆弄动态正则表达式

使其可重复使用

如果您希望这是一个通用模式，您可以将其提取到这样的函数中

function replaceAll(str,mapObj){
    var re = new RegExp(Object.keys(mapObj).join("|"),"gi");

    return str.replace(re, function(matched){
        return mapObj[matched.toLowerCase()];
    });
}

因此，您只需将 str 和所需替换的映射传递给该函数，它就会返回转换后的字符串。

摆弄功能

为了确保 Object.keys 在旧版浏览器中工作，请添加一个填充，例如来自MDN or Es5.