javascript: замена слов в строке из списка

есть строка text и массив ключевых слов this.state.keywords

необходимо произвести замену ключевых слов XXX в строке на выражения вида <span class = 'c0*'>XXX</span>

где * - значение от 1 до 4 (по сути номер ключевого слова в словаре по модулю 4)

Написал такой код:

highlightText = (text: string) => {
    let output: string = text;
    let index: number = 0;
    for (const keyword of this.state.keywords) {
        output = output.replace(new RegExp(keyword, 'ig'), `<span class='c0${index % 4 + 1}'>${keyword}</span>`, );
        index += 1;
    }

    return output;
}

Как по мне он корявенький и избыточный.

Подскажите, как бы его сделать поэлегантнее, условно можно ли его схлопнуть в пару строк


Ответы (1 шт):

Автор решения: the_Solomon

По короче - можно так.

const highlightText = (text) => {
    this.state.keywords.forEach((keyword, i) => {
        text = text.replace(new RegExp(keyword, "gi"), `<span class='c0${i % 4 + 1}'>${keyword}</span>`)
    })
    return text;
}

Удобнее для чтения - вот так:

const highlightText = (text) => {
    const keywords = this.state.keywords;

    keywords.forEach((keyword, i) => {
        const template =  `<span class='c0${i % 4 + 1}'>${keyword}</span>`
        const re = new RegExp(keyword, "gi");

        text = text.replace(re, template)
    })
    return text
}
→ Ссылка