14.模版字符串

模版字符串(template string)是增强版的字符串,定义一个模版字符串需要用到反引号

  1. let s = `这是一个模版字符串`
  2. console.log(s)

14.1.模版字符串的应用场景

在es5中,我们经常会遇到字符串拼接的情况,例如:输入标题1-6

  1. for(let i = 1; i <= 6; i++){
  2. document.write('<h'+i+'>标题'+i+'</h'+i+'>')
  3. }

在es6中,支持模版字符串的写法,我们可以写成下面这种形式

  1. for(let i = 1; i <= 6; i++){
  2. document.write(`<h${i}>标题${i}</h${i}>`)
  3. }

模版字符串的好处就是可以使得拼接字符串非常的方便,例如:

  1. let htmlStr = `
  2. <div id="dialog-wrap">
  3. <div class="dialog-title">
  4. <p class="title-text"></p>
  5. </div>
  6. <div class="dialog-content">
  7. <ul class="list-group"></ul>
  8. </div>
  9. </div>
  10. `
  11. document.body.innerHTML = htmlStr;

视频教程地址:http://edu.nodeing.com/course/50

es6+最佳入门实践(14)的更多相关文章

  1. es6+最佳入门实践(1)

    1.let和const 1.1.let和块级作用域 在es5中,js的作用域分为全局作用域和局部作用域,通常是用函数来区分的,函数内部属于局部作用域,在es6中新增了块级作用域的概念,使用{}括起来的 ...

  2. es6+最佳入门实践(12)

    12.class基础用法和继承 12.1.class基础语法 在es5中,面向对象我们通常写成这样 function Person(name,age) { this.name = name; this ...

  3. es6+最佳入门实践(10)

    10.Generator 10.1.Generator是什么? Generator函数是ES6提供的一种异步编程解决方案.在它的内部封装了多个状态,因此,又可以理解为一种状态机,执行Generator ...

  4. es6+最佳入门实践(9)

    9.Iterator和for...of 9.1.Iterator是什么? Iterator又叫做迭代器,它是一种接口,为各种不同的数据结构提供统一的访问机制.这里说的接口可以形象的理解为USB接口,有 ...

  5. es6+最佳入门实践(8)

    8.Promise 8.1.什么是异步? 要理解异步,首先,从同步代码开始说 alert(1) alert(2) 像上面的代码,执行顺序是从上到下,先后弹出1和2,这种代码叫做同步代码 alert(0 ...

  6. es6+最佳入门实践(7)

    7.set和map数据结构 7.1.什么是set? Set就是集合,集合是由一组无序且唯一的项组成,在es6中新增了set这种数据结构,有点类似于数组,但是它的元素是唯一的,没有重复 let st = ...

  7. es6+最佳入门实践(6)

    6.Symbol用法 6.1.什么是Symbol? Symbol是es6中一种新增加的数据类型,它表示独一无二的值.es5中我们把数据类型分为基本数据类型(字符串.数字.布尔.undefined.nu ...

  8. es6+最佳入门实践(5)

    5.对象扩展 5.1.对象简写 在es5中,有这样一种写法 var name = "xiaoqiang"; var age = 12; var obj = { name : nam ...

  9. es6+最佳入门实践(4)

    4.函数扩展 4.1.参数默认值 默认参数就是当用户没有传值的时候函数内部默认使用的值,在es5中我们通过逻辑运算符||来实现 function Fn(a, b) { b = b || "n ...

随机推荐

  1. urllib.request.urlretrieve()

    urllib模块提供的urlretrieve()函数.urlretrieve()方法直接将远程数据下载到本地. urlretrieve(url, filename=None, reporthook=N ...

  2. h5调试工具

    1.Safari:iPhone 调试利器,查错改样式首选: 2.iOS 模拟器:不需要真机,适合调试 Webview 和 H5 有频繁交互的功能页面: 3.Charles: Mac OS 系统首选的抓 ...

  3. TensorLayer 中文文档

    TensorLayer 中文文档 好消息 我们获得了 ACM Multimedia (MM) 年度最佳开源软件奖. TensorLayer 是为研究人员和工程师设计的一款基于Google Tensor ...

  4. 「题目代码」P1034~P1038(Java)

    P1034 C基础-求同存异 import java.util.*; import java.io.*; import java.math.BigInteger; public class Main ...

  5. 自动化测试---mybatis的使用

    mybatis如何实现了对数据库的操作: 1.通过Resources.getResourceAsReader()或者 Resources.getResourceAsStream()加载mybatis. ...

  6. Oracle修改表字段类型(number-->varchar2(len)),亲测可用

    思路: --新建临时表以存储正确的顺序create table A_2 as select (column1,colum2,……A表中的顺序) from A_1 ; --删除表A_1drop tabl ...

  7. Struts2(二.用户登录模块)

    1.编写Javabean /src/myuser/User.java 在strut1中,Javabean需要继承于struts1 api中的ActionForm类.struts2没有此要求 strut ...

  8. Nginx 配置 HTTPS自签名证书

    工具: OpenSSL ssl的开源实现,几乎实现了市面上所有的加密 libcrypto: 通用加密库, 任何软件要实现加密功能 链接调用这个库 libssl: TLS/SSL 加密库 openssl ...

  9. 重写page的OnInit(学习中总结的)

    在写b/s框架的系统的时候,我们会发现,我们经常会在不同的网页中验证Session是否存在,,而我这里没有用Session,用的是MemCache技术,其实它就是键值对. 只不过将Memcache中的 ...

  10. 【Linux】——搭建redis

    1.准备安装文件 redis-3.0.5.tar.gz redis-desktop-manager(可视化管理工具) 2.解压.编译 软件存放目录:/usr/local/software 解压存放路径 ...