Для каждого x в строке заменить случайным результатом

Question

Мне нужно заменить тысячи экземпляров #FFF в строке через

Math.floor(Math.random()*16777215).toString(16)

Проблема, с которой я столкнулся, заключается в том, что я не могу заставить JS запускать эту команду для каждого #FFF в строке, вместо этого он заменяет все #FFF на один результат.

var string = '1677px 335px #FFF , 59px 1161px #FFF , 850px 963px #46f3b8';
var randomColor = string.replace(/#FFF/g, "#"+Math.floor(Math.random()*16777215).toString(16));
console.log(randomColor);

дает что-то вроде:

1677px 335px #46f3b8 , 59px 1161px #46f3b8 , 850px 963px #46f3b8

Answer 1

Проблема в том, что в вашем коде

'#' + Math.floor(Math.random()*16777215).toString(16)

оценивается один раз, затем его строка результата передается в replace, и он заменяет все вхождения #FFF этой строкой.

Вместо этого вы можете использовать функцию как заменитель, которая называется для каждого совпадения и может генерировать разные значения:

var string = '1677px 335px #FFF , 59px 1161px #FFF , 850px 963px #46f3b8';
var randomColor = string.replace(/#FFF/g, () => '#' + Math.floor(Math.random()*16777215).toString(16));
console.log(randomColor);

Answer 2

Мне нравится подход разделения вашей строки, затем повторения и объединения вместе с использованием уникальных значений:

var string = '1677px 335px #FFF , 59px 1161px #FFF , 850px 963px #FFF , 333px 496px #FFF , 704px 507px #FFF';
var parts = string.split("#FFF");
var output = parts[0];
for (i=1; i < parts.length; ++i) {
    output += "#" + Math.floor(Math.random()*16777215).toString(16) + parts[i];
}
console.log(string);
console.log(output);