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

Почему?

Данный мини-проект является частью моего веб-движка, который я сейчас делаю на JavaScript. Подробнее обо всём можно прочитать Здесь.

Поехали

Первым делом, что я буду делать:

  • Поддержку вывода переменных

  • Поддержку редактирования переменных

Весь код вырван из контекста и представляет собой пред-обработка html файла перед отправкой с сервера.

Вывод переменных

Предполагаем что синтаксис должен быть таким:

<myVariable>

Так сделано потому что HTML-friendly.

Опираясь на этот результат я могу точно описать RegExp, которым я смогу получать и заменить переменные. Вот такой:

/(\<myVariable\>)/ig

В данном случае myVariable это статично заданная переменная, но можно пойти дальше и к своей абстрактной функции обработки файла приписать 2 аргумента - путь к файлу и объект с переменными.

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

for (const variable of Object.entries(variables)) {
    if (new RegExp('\<' + variable[0] + '\>', 'ig').test(fileContent)) {
        fileContent = fileContent.replace(new RegExp('\<' + variable[0] + '\>', 'ig'), variable[1]);
    }
}

в данном примере fileContent - это текст который мы получали из файла (путь к которому является первым аргументов к нашей абстрактной функции)

Редактирование переменных

Предполагаем что синтаксис редактирования должен быть таким:

<set name="myValue" value="test">

В таком случае RegExp для обнаружения переменных должен быть таким:

/(\<set name\=\"(.*?)\" value\=\"(.*?)\"\>)/ig

Исходя из такого регулярного выражение можно написать следующий JavaScript-код для редактирования переменной:

fileContent = fileContent.replace(/(\<set name\=\"(.*?)\" value\=\"(.*?)\"\>)/ig, (match) => {
    match = match.replace(/(set|name|value|\"|\=|\>|\<)/ig, ''); // Удаляем лишние элементы
    match = match.trim();

    // Ключ, который мы будем менять
    let name = match.split(' ')[0];

    match = match.split(' ').splice(0, 1);
    match = match.join(' ');

    // Новое значение
    let value = match;

    variables[name] = value;

    return '';
});

Обратите внимание: код редактирования лучше выполнять перед выводом для нормальной работы.

Завершение

Вот такая простая статья получилась, полностью посмотреть код можно В репозитории, также для тех у кого есть иммунитет к кринжу можно ознакомится с видео-материалами по движку (и не только) вот тут - Ютуб