Non-capturing group matching whitespace boundaries in JavaScript regex

Question

I have this function that finds whole words and should replace them. It identifies spaces but should not replace them, ie, not capture them.

function asd (sentence, word) {
     str = sentence.replace(new RegExp('(?:^|\\s)' + word + '(?:$|\\s)'), "*****");
     return str;
};

Then I have the following strings:

var sentence = "ich mag Äpfel";
var word = "Äpfel";

The result should be something like:

"ich mag *****" 

and NOT:

"ich mag*****"

I'm getting the latter.

How can I make it so that it identifies the space but ignores it when replacing the word?

At first this may seem like a duplicate but I did not find an answer to this question, that's why I'm asking it.

Thank you

Answer 1

You should put back the matched whitespaces by using a capturing group (rather than a non-capturing one) with a replacement backreference in the replacement pattern, and you may also leverage a lookahead for the right whitespace boundary, which is handy in case of consecutive matches:

function asd (sentence, word) {
     str = sentence.replace(new RegExp('(^|\\s)' + word + '(?=$|\\s)'), "$1*****");
     return str;
};
var sentence = "ich mag Äpfel";
var word = "Äpfel";
console.log(asd(sentence, word));

See the regex demo.

Details

• (^|\s) - Group 1 (later referred to with the help of a $1 placeholder in the replacement pattern): a capturing group that matches either start of string or a whitespace
• Äpfel - a search word
• (?=$|\s) - a positive lookahead that requires the end of string or whitespace immediately to the right of the current location.

NOTE: If the word can contain special regex metacharacters, escape them:

function asd (sentence, word) {
     str = sentence.replace(new RegExp('(^|\\s)' + word.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&') + '(?=$|\\s)'), "$1*****");
     return str;
};