Javascript пользовательский шаблонизатор

Question

Я пытаюсь создать собственный шаблонизатор в javascript, но у меня возникают проблемы с началом работы, так как я не могу извлекать токены с помощью регулярного выражения. Вот требования:

1. Переменные определяются следующим образом: $(variable)
2. Функции: $(name arg1 "this is arg2 but it contains whitespaces.")
3. Аргументы функции могут содержать другие переменные $(name $(variable) arg2)

И переменные, и функции будут отображаться asyn c. Например: получите значение для $(variable) из базы данных, затем замените его.

Это не для рендеринга страницы html, а просто для замены строки, введенной пользователем на бэкэнде.

Изменить

Дополнительная информация: Предположим, пользователь вводит следующую строку: $(id $(lowercase John)) В бэкэнд-приложении необходимо выполнить:

1. Преобразовать «John» в нижний регистр.
2. Получить идентификатор для «john» из базы данных.

Это только простой пример, демонстрирующий, как это должно работать.

Существуют ли библиотеки, которые могут помочь мне в этом? Если нет, есть идеи, как это реализовать?

EDIT 2: Я пробовал использовать Mustache , и я изменил разделители на $ (), однако функция (раздел ) теги не удовлетворяют требованиям. В Mustache для функций я должен сделать следующее: $(#name) $(variable) "this is arg2 but it contains whitespaces."$(/name) также он не поддерживает асинхронный c рендеринг.

Answer 1

Здесь . Это регулярное выражение будет определять шаблоны, которые можно заменить. Обратите внимание, что он выбирает только самые внутренние шаблоны во вложенных шаблонах.

/\$\((?<FirstTerm>\S+?)(?<OtherTerms>(?:\s+(?:\w+|".*?"))+)?\)/g

Так что просто рекурсивно используйте функцию замены регулярного выражения с вашим шаблоном logi c, пока совпадений не останется. Внутренние шаблоны будут заменены, и у вас останется строка с замененными шаблонами.

Answer 2

Если нет, есть идеи, как это реализовать?

Вы должны использовать абстрактное синтаксическое дерево и написать совместимый синтаксический анализатор. Хотя регулярное выражение (как заявил Педро Лима) хорошо для простых шаблонов, если вы когда-нибудь захотите расширить синтаксический анализатор, вам понадобится что-то более надежное.

В качестве примера синтаксического анализатора абстрактного синтаксического дерева $(test1 $(test2) test3) lorem ipsum $(test4) будет преобразовано в следующее:

(Thanks to Mile Shang's Syntree для генератора дерева.)

Что касается конкретно того, как написать парсер, я думаю, вы можете понять это. Просто переберите строку и проверьте наличие разделителя шаблона. Может помочь чтение исходного кода библиотеки шаблонов, такой как Handlebars.

Answer 3

Другие ответы на этот пост верны, однако я хочу рассказать, как именно мне удалось это реализовать:

1. Создайте рекурсивную функцию сопоставления. Я использовал статью Стивена Левиафана для реализации этого.

2. Создайте функцию рендеринга и внутри функции вызовите функцию рекурсивного сопоставления, чтобы найти и заменить имена переменных / функций соответствующими значения.

3. Продолжайте вызывать функцию рендеринга рекурсивно, пока все аргументы внутри функции не будут заменены.