запуск кода в области видимости другой функции (JavaScript) - PullRequest
Новая
       17

запуск кода в области видимости другой функции (JavaScript)

0 голосов
/ 29 апреля 2018

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

Первый метод, который я использовал, был объектами, и код просто перебрал бы указанный html-элемент и отыскивал вхождения {{key}} в разметке, а затем искал этот ключ в объекте и заменил его таким образом в HTML .

Например, если у вас <div>{{name}} is a cool guy</div> в HTML и {name:"joseph"} в JS, то конечный продукт будет отображаться на экране как "Джозеф крутой парень".

Однако позже я решил изменить свой метод, и вместо этого фреймворк за исключением функции. Поэтому вместо {name:"joseph"} вы бы дали function(){ var name = "joseph" }.

Это, очевидно, выглядит лучше и дает намного лучшую функциональность.

Я изменил функцию обработки, поэтому вместо поиска пары ключ / значение вместо {{key}} он просто использует eval для переменной, чтобы получить ее значение.

Моя проблема заключается в следующем: как запустить код поиска / замены ВНУТРИ области действия функции, которую передает пользователь.

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

Я пытался использовать Function.toString() для фактического изменения исходного кода функции, но ничего не работает, и все это очень сложно. (Проблемы не связаны с фактическим решением, я думаю, что Function.toString() может работать, но из-за моей реализации. Я продолжаю получать ошибки)

Итак ... Каков наилучший способ запуска произвольного кода в области действия другой функции?

Critera:

  1. Очевидно, что я не могу изменить функцию, потому что пользователь передает ее. (Вы не можете просто сказать мне добавить код поиска / замены в конец функции)
  2. Переменные должны оставаться в локальной области действия функции. (без мошенничества с использованием window.name = "joseph" или чего-либо еще)

Я также знаю, насколько ужасен eval, поэтому любые предложения, чтобы заставить его работать, очень ценятся. Спасибо!

Код: 

function process(html) {
        var vars = html.match( /({{)[^{}]*(}})/g )
        // vars = ['{{variable}}', '{{anotherVariable}}']
        var names = vars.map( function(x){ return x.replace("{{", "").replace("}}", "") } )
        // names = ['variable', 'anotherVariable]

        obj = {}

        for (var i = 0; i < names.length; i++) {
            obj[names[i]] = eval(names[i])
        }

        for (var p in obj) {
            html = html.replace(new RegExp('{{'+p+'}}','g'), obj[p]);
        }

        return html
}

1 Ответ

0 голосов
/ 29 апреля 2018

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

function () {
    return { name: 'joseph' }
}
...