Как можно сделать сложные плейсхолдеры в js

Всем привет!

Как можно заменить в строке

const str = "My name is {{user.name}} and I am {{user.age}} years old."
{{user.name}} на Bob

и

{{user.age}} на 59

Объект выглядит так:

const data = {
  user: {
    name: "Bob",
    age: 59
  }
}

Также, как можно применить фильтры на эти плейсхолдеры, допустим есть функция lower

function lower (input) {
  return input.toLowerCase()
}

Как я могу применить его в плейсхолдере, допустим, у меня строка будет выглядеть следующим образом:

const str = "My name is {{user.name | lower}} and I am {{user.age}} years old."

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

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

Вкратце, чтобы найти все все группы типа {{ content }} используются регулярные выражения


const replacer = (content) => {
  content = content.slice(2, -2).trim();
  console.log(content);
  // здесь будет "user.name | lower" в первом совпадении и "user.age" во втором
  
  
  return 123;
}
str = str.replace(/\{\{.+?\}\}/g, replacer);

Перевод строки user.name в реальное значение уже совсем другая тема с множеством решений. Если хотите можете использовать eval, на клиентской части это не так опасно

→ Ссылка