Replace string with array

Question

I have strings which before processing (translate) have to be replaced, then after processing (translation done) replaced again.

 var str = 'BUY [[Manufacturer]] [[Name]] cheap or get other [[Categories]] from [[Storename]] <i class="fa fa-check"></i> Thousands of satisfied customers.';

So I first reference them in an array with:

var res = str.match(/\[\[.*?\]\]/gm);

then I replace them:

var placeholder_string = str.replace(/\[\[.*?\]\]/gm,"|");

then it will be processed (in this case translated).

Now I want to reverse back all placeholders "|" with the array res.

I know I can take a function in the replace argument from replace(), but please help me how to achieve that efficiently.

var revert_string = placeholder_string.replace("|", myfunc());

or is there a better way??

Answer 1

A simple solution would be to use a function replacement like you suggest, and for each match, retrieve (and remove) the next item from your saved matches.

Array.shift() does this nicely, and you don't need to keep track of indices or anything else.

const str = 'BUY [[Manufacturer]] [[Name]] cheap or get other [[Categories]] from [[Storename]] <i class="fa fa-check"></i> Thousands of satisfied customers.';
const res = str.match(/\[\[.*?\]\]/gm);
// for demonstration purposes,
// uppercase the placeholder to show that the string has changed
// while maintaining the fields' positions afterwards
const placeholder_string = str.replace(/\[\[.*?\]\]/gm, "|").toUpperCase();
const revert_string = placeholder_string.replace(/\|/g, () => {
 return res.shift();
});
console.log(revert_string);

Answer 2

You can use a counter and increase the counter on each replace callback invocation

var str = 'BUY [[Manufacturer]] [[Name]] cheap or get other [[Categories]] from [[Storename]] <i class="fa fa-check"></i> Thousands of satisfied customers.';
var res = str.match(/\[\[.*?\]\]/gm)
var placeholder_string = str.replace(/\[\[.*?\]\]/gm,"|").toLowerCase()
function stringRevert(str){
 let i = 0;
 return str.replace(/\|/g,()=> res[i++]);
}
var revert_string = stringRevert(placeholder_string)
console.log(revert_string)

Answer 3

I suggest you to use split, this also lets you use | in your text. This approach might also be faster (I think it should be).

const str = '||BUY|| [[Manufacturer]] [[Name]] cheap or get other [[Categories]] from [[Storename]] <i class="fa fa-check"></i> Thousands of satisfied customers.';
// | here does not match the | character, its an or statement. So match "[[" or "]]"
const parts = str.split(/\[\[|\]\]/g) 
//get every odd part, so everything between "[[" and "]]"
let placeholders = parts.filter((_,i) => i%2==1)
//process, just as an example. Put your translation logic here
placeholders = placeholders.map((t, i) => `(Replacement for ${t})`)
//put them back together
const replaced = parts.map((p, i) => {
 if(i % 2 == 1) return placeholders[(i-1)/2];
 return p
});
const replacedStr = replaced.join('')
console.log(replacedStr)