Я столкнулся с проблемой с регулярным выражением и заменой строки, и я хотел бы немного помочь.
У меня есть строка в следующем формате
<div class="$(unique-result) single-result data-index=$(i)"><div class="airport-data data-index=$(i)">$(name)<br>$(city) ,$(country)</div><div class="airport-code data-index=$(i)">$(IATA)</div></div>
и мне нужно заменить все $ (unique-result) моей строкой.
Я попробовал следующий код, но я не могу понять, почему это не работает
string.replace(new RegExp('\\$(unique-result)', 'g'), changeString)
В результате получается та же самая строка, которую я дал в качестве входных данных.
Кто-нибудь может мне помочь, но также указать, почему это не сработало?
Заранее спасибо.
Вы пропустили побег. вам нужно правильно сбежать
let str = '<div class="$(unique-result) single-result data-index=$(i)"><div class="airport-data data-index=$(i)">$(name)<br>$(city) ,$(country)</div><div class="airport-code data-index=$(i)">$(IATA)</div></div>'
let op = str.replace(new RegExp('\\$\\(unique-result\\)','g'), 'Changed')
console.log(op)
Если я не использую переменную, я предпочитаю использовать регулярное выражение (//)
let str = '<div class="$(unique-result) single-result data-index=$(i)"><div class="airport-data data-index=$(i)">$(name)<br>$(city) ,$(country)</div><div class="airport-code data-index=$(i)">$(IATA)</div></div>'
let op = str.replace(/\$\(unique-result\)/g, 'Changed')
console.log(op)
Есть более общее решение.
Прежде всего, как я упоминал в комментариях, вам не нужно использовать конструктор RegExp
, вы можете просто передать свое регулярное выражение между слешами и использовать флаги после последнего слеша:
str.replace(/\$\(unique-result\)/g, "someValue")
Второй момент заключается в том, что String.prototype.replace
может принимать функцию в качестве второго параметра. Это будет полезно, когда в вашей строке много именованных шаблонов. Например, у вас есть следующая входящая строка:
var incomingString = "$(first-value) says $(second-value) when there is $(third-value)"
С кодом, который вы предоставили, вы должны позвонить replace
3 раза. Но если вы будете использовать функцию в качестве второго параметра, это можно упростить до:
var incomingString = "$(first-value) says $(second-value) when there is $(third-value)"
var data = {
"first-value": "Kappa",
"second-value": "Hey!",
"third-value": "GreyFaceNoSpace"
}
var resultString = incomingString.replace(/\$\(([^)]+)\)/g, (match, capture) => {
console.log(match, capture)
return data[capture]
})
console.log(resultString)
"ЧТО ПРОИСХОДИТ ЗДЕСЬ?!" Вы, вероятно, спросите. Ничего сложного.
\$\(([^)]+)\)
, где [^)]+
относится к одному или нескольким любым символам. исключая закрывающую скобку, и эта конструкция должна быть зафиксирована (она находится между необработанными скобками). Так что, как только это регулярное выражение будет соответствовать, он будет проходить весь $(...)
строительство в match
аргумент передается функция, а имя шаблона в capture
аргумент. Таким образом, capture
является нашим ключом для некоторого хранения данных, и мы просто возвращаем это значение в функцию.
Это! Надеюсь, это будет полезно :)
Вы можете использовать простую функцию, чтобы сделать замену. Сопоставьте каждую $(string)
и примените функцию, чтобы заменить ее переменной, хранящейся в объекте. Легко и расширяемо.
const tpl = '<div class="$(unique-result) single-result data-index=$(i)"><div class="airport-data data-index=$(i)">$(name)<br>$(city) ,$(country)</div><div class="airport-code data-index=$(i)">$(IATA)</div></div>';
const vars = {
i : 9,
'unique-result' : 'uniq',
country : 'gb',
city : 'Manchester',
IATA : 'MCH'
};
const replaceVars = (tpl,vars) => {
const replacer = (m, m1) =>
typeof vars[m1] != 'undefined' ? vars[m1] : '';
return tpl.replace(/\$\(([\w-]+)\)/g, replacer);
};
console.log(replaceVars(tpl,vars));
(
тоже так\(
и то же самое)
с\)