IT培训-高端面授IT培训机构
云和教育:云和数据集团高端IT职业教育品牌 全国咨询热线:0371-67988003
课程 请选择课程
    校区 请选择校区
      • 华为
        授权培训中心
      • 腾讯云
        一级认证培训中心
      • 百度营销大学
        豫陕深授权运营中心
      • Oracle甲骨文
        OAEP中心
      • Microsoft Azure
        微软云合作伙伴
      • Unity公司
        战略合作伙伴
      • 普华基础软件
        战略合作伙伴
      • 新开普(股票代码300248)
        旗下丹诚开普投资
      • 中国互联网百强企业锐之旗
        旗下锐旗资本投资

      Underscore是什么?怎样使用Underscore模板引擎?

      • 发布时间:
        2022-12-15
      • 版权所有:
        云和教育
      • 分享:

      前端开发有时候避免不了要在JavaScript代码中插入HTML代码,插入的代码少时还好些,如果比较多,在以后的编辑中会出现很多问题,例如一不小心可能漏掉某个双引号、加号等导致语法错误。为了将它们剥离开,出现JavaScript 模板。

      Underscore是一个JavaScript实用库,提供了一整套函数式编程的实用功能,但是没有扩展任何JavaScript内置对象。下面要介绍的template是Underscore 提供的一个实用功能一一模板引擎,template功能将JavaScript模板编译为可以用于页面呈现的函数,通过JSON数据源生成复杂的HTML并呈现出来。

      模板函数的使用语法如下:

      _.template(templateString,  [settings])

      在上述语法中,templateString参数通常是字符串,模板函数可以使用<%=…%>插入变量,也可以用<%…%>执行任意的JavaScript代码。如果要想模板中插入一个值,并让其进行HTML转义,可以使用<%-…%>。具体用法如下:

      (1)赋值:

      var compiled = _.template("hello:  <%= name % >");
      compiled((name: 'moe'});
      => "hello:moe"

      上述语法中,使用_.template()函数定义了一个变量name,然后compiled()函数用于name属性注入数据moe。

      (2)需要转义:

      var template = _.template("<b><%- value % ></b>");
      template({value:  '<script>'});
      => "<b><script></b>"

      在上述语法中,插入<script>值并且成功转义为&lt;script&gt。

      在Node.js中使用Underscore是需要进行安装的,可以使用包管理器NPM来安装。

      下面通过一个静态资源服务的案例来演示Node.js中如何使用Underscore。

      (1)在chapter07目录下创建项目目录static-server。

      (2)进入static-server目录下,输入npm init-y命令进行npm初始化。