Replace multiple strings with multiple other strings

I’m trying to replace multiple words in a string with multiple other words. The string is “I have a cat, a dog, and a goat.”

However, this does not produce “I have a dog, a goat, and a cat”, but instead it produces “I have a cat, a cat, and a cat”. Is it possible to replace multiple strings with multiple other strings at the same time in JavaScript, so that the correct result will be produced?

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".

Answer

As an answer to:

looking for an up-to-date answer

If you are using “words” as in your current example, you might extend the answer of Ben McCormick using a non capture group and add word boundaries b at the left and at the right to prevent partial matches.

b(?:cathy|cat|catch)b

• b A word boundary to prevent a partial match
• (?: Non capture group
  • cathy|cat|catch match one of the alternatives
• ) Close non capture group
• b A word boundary to prevent a partial match

Example for the original question:

let str = "I have a cat, a dog, and a goat.";
const mapObj = {
  cat: "dog",
  dog: "goat",
  goat: "cat"
};
str = str.replace(/b(?:cat|dog|goat)b/gi, matched => mapObj[matched]);
console.log(str);

Example for the example in the comments that not seems to be working well:

let str = "I have a cat, a catch, and a cathy.";
const mapObj = {
  cathy: "cat",
  cat: "catch",
  catch: "cathy"

};
str = str.replace(/b(?:cathy|cat|catch)b/gi, matched => mapObj[matched]);
console.log(str);