Javascript 使用扩展运算符的模板函数

我不是想在这里重新发明轮子，只是在玩弄一个向我提出的问题。如何编写一个简单的模板引擎函数。我的直接回答是更老派的，但是有了ES6和新的扩展操作符，我想也许现在有更好的方法使用扩展操作符来实现这一点。 有人知道吗？或者我仍然需要循环查找我的分隔符，就像我在const delimiter={{name}}}下面使用的那样

    const root = document.getElementById('root');
    const html = "<p>My name is {{ name }}</p>";

    var template = function(html){
      return function(data){
        for(var prop in data){
          var regx = "{{\\s?" + prop + "\\s?}}";
          html = html.replace(new RegExp(regx, "ig"), data[prop]);  
        }
        return html;
        }
    }

    var tmp = template(html);
    root.innerHTML = tmp({
      name: "John Doe"
    });;

const root=document.getElementById（'root'）；
const html=“我的名字是{{name}
”；
变量模板=函数（html）{
返回函数（数据）{
用于（数据中的var prop）{
var regx=“{{\\s？”+prop+”\\s？}”；
html=html.replace（新的RegExp（regx，“ig”），data[prop]）；
}
返回html；
}
}
var tmp=模板（html）；
root.innerHTML=tmp({
姓名：“约翰·多伊”
});;

不使用spread运算符，但我将使用

class

而不是function函数，并使用

Object.keys

生成一个正则表达式（用于所有键），使用回调参数

replace

：

类模板{
构造函数（html）{
this.html=html；
}
解析（数据）{
const regx=“{{\\s？（“+Object.keys（data.join”（“|”）+”\\s？}”；
返回this.html.replace（newregexp（regx，“ig”），（m，prop）=>data[prop]）
}
}
常量分隔符=“{{name}}”，
root=document.getElementById（'root'），
html=“我的名字是{{name}
”，
tmp=新模板（html）；
root.innerHTML=tmp.resolve({
姓名：“约翰·多伊”
});
我在这里没有看到任何模拟扩展运算符的操作。您对扩展语法有何想法？我看不出它在模板引擎中有什么用处。请看一下。我没有使用spread运算符，但我看到它允许您使用字符串模板${string}传递对象我只是想我可以使用它，而不是在字符串中循环查找分隔符，但我想在阅读了更多关于spread运算符的内容后就不会了。我想唯一的办法就是像我这样循环。