Skip to content

Instantly share code, notes, and snippets.

@raohmaru
Last active May 31, 2025 10:19
Show Gist options
  • Save raohmaru/c748ed5ec35429a05db97c229ae2bd56 to your computer and use it in GitHub Desktop.
Save raohmaru/c748ed5ec35429a05db97c229ae2bd56 to your computer and use it in GitHub Desktop.
Mini template engine in JavaScript
/**
* Mini template engine. Parses variables (w/o dot notation) and does not delete undefined variable expressions.
* @param {string} expr - String expression with {{variables}} to interpolate.
* @param {RegExp} [regex] - Custom regex to match variables. By default it matches double curly braces `{{variables}}`.
* @returns {(data:Object|string[]) => void} - A function that accepts an object or an array as argument to interpolate the template variables.
* @example
* const templateObj = parseTemplate('{{a}} {{b.c}}');
* template({a: 'hello', b: {c:'world'}}); // "hello world"
*
* const templateArr = parseTemplate('{{}} {{}}');
* templateArr(["hello", "world"]); // "hello world"
*
* const templateArrIndex = parseTemplate('{{0}} {{1}}');
* templateArrIndex(["hello", "world"]); // "hello world"
*
* parseTemplate('{{name}}')(); // "{{name}}"
*/
const parseTemplate = (expr, regex = /\{\{([^}]*)}}/g) => {
return (data) => {
let i = 0;
return expr.replace(regex, (s, p1) => {
if (Array.isArray(data)) {
return data[p1 || i++];
}
// Get property of object using a string with dot notation
return p1.split('.').reduce((o, i) => o[i] ?? s, data || {});
})
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment