js {{}} 实现

在 JavaScript 中，双大括号 {{}} 通常用于模板字符串插值或某些框架（如 Vue、Handlebars）的模板语法。以下是几种常见实现方式：

模板字符串插值

使用反引号（`）包裹字符串，并通过 ${} 插入变量：

const name = 'World';
console.log(`Hello ${name}`); // 输出: Hello World

Vue.js 中的双大括号

Vue 使用 {{}} 进行数据绑定：

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
});

HTML 模板：

<div id="app">
  {{ message }} <!-- 渲染为: Hello Vue! -->
</div>

自定义双大括号替换

通过正则表达式实现简单模板替换：

function render(template, data) {
  return template.replace(/\{\{(.*?)\}\}/g, (match, key) => data[key.trim()]);
}

const output = render('Hello {{ name }}', { name: 'World' });
console.log(output); // 输出: Hello World

注意事项

• 原生 JavaScript 中 {{}} 无特殊含义，需通过模板字符串或自定义逻辑实现。
• 前端框架（如 Vue、Angular）通常内置 {{}} 语法支持，无需手动处理。