Захватить отстающие / ведущие белые пряди вокруг узора, если он существует?

Question

Предположим, что вы хотите заменить искомую строку в тексте, заменить ее и "выделить", т.е. обернуть ее в <span> классом css:

const highlight = (str, ptn) => {
  if (ptn === '') return str
  str.replace(new RegExp(ptn, 'g'), `<span class="highligh">${ptn}</span>`)
}

Как изменитьэтот шаблон регулярных выражений, чтобы включить пробелы в начале / обучения, если он существует?так как промежуток не будет заботиться о пропусках, которыми он окружен, и шаблон ptn может быть частью слова ...

example   str            ptn      res (as appears when render)
1         this is a str  is       thisisa str
2         this is a str  i        thisis a str
3         this is a str  t        this is a str
4         this is a str  his      thisis a str

, поэтому, например, 4 замена его будет захватывать конечный " "

Answer 1

Не обязательно хорошо понимать, каким должен быть результат, но вот чего вы хотите:

const highlight = (str, ptn) => {
  if (ptn === '') return str
  return str.replace(new RegExp('\\s+'+ptn+'|'+ptn+'\\s+', 'g'), `<span class="highligh">${ptn}</span>`)
}

var test = [
    'is',
    'i',
    't',
    'his',
];
test.map(function(a) {
console.log(highlight('this is a str', a));
});

Answer 2

Я бы использовал регулярное выражение для сопоставления начального / конечного пробела.

var str = 'this is a str his';
var result = str.replace(/( )*his( )*/g, (p)=>`<span>${p}</span>`)
console.log(result);