Just like how JS template engines such as Handlebars can be used to dynamically insert values within HTML using
<div>{{value inserted by JavaScript}}</div>{{curly brackets}} notation. For example:
var myFunction= {{My Function}};
var bar = myFunction(foo);
Here is an example of code defined within the My Function template:
function(foo) {
return foo+'bar';
}
I have attempted to search on Google for a solution, but have not had much luck since most results focus on JavaScript template engines like Handlebars.
Do you have any suggestions on how I could achieve this in JavaScript within the browser?
Note: The reason behind my interest in achieving this is to create JavaScript functions that can be unit-tested in my browser and easily reused without having to modify {{template}} code in JavaScript Functions utilized by Google Tag Manager which supports {{curly brackets}} notation within its JavaScript engine.
Note 2: If implementing this directly in JavaScript proves too complex, I may resort to using a back-end language like Twig in PHP to write my JavaScript code with {{curly brackets}} and then send plain JavaScript to the browser so that my unit tests function properly and the code is reusable as is from the backend.