ES6 Template String 模板字符串
模板字符串(Template String)是增强版的字符串,用反引号(`)标识,它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。
大家可以先看下面一段代码:
$("#result").append(
"There are <b>" + basket.count + "</b> " +
"items in your basket, " +
"<em>" + basket.onSale +
"</em> are on sale!"
);
我们要用一堆的'+'号来连接文本与变量,而使用ES6的新特性模板字符串``后,我们可以直接这么来写:
$("#result").append(`
There are <b>${basket.count}</b> items
in your basket, <em>${basket.onSale}</em>
are on sale!
`);
用反引号`来标识起始,用${}
来引用变量,而且所有的空格和缩进都会被保留在输出之中,是不是非常爽?!
ES6 Template String 模板字符串的更多相关文章
- ES6中的模板字符串和新XSS Payload
ES6中的模板字符串和新XSS Payload 众所周知,在XSS的实战对抗中,由于防守方经常会采用各种各样严格的过滤手段来过滤输入,所以我们使用的XSS Payload也会根据实际情况作出各种各样的 ...
- es6 中的 模板字符串
Template literals are string literals allowing embedded expressions. You can use multi-line strings ...
- ES6中的模板字符串使用方法
传统的 JavaScript 语言,输出模板通常是这样写的. $('#result').append( 'There are <b>' + basket.count + '</b&g ...
- es6学习笔记--模板字符串
这几天简单看了一下深入浅出es6这本书,感觉特实用,学习了一个新特性---模板字符串在项目开发中,拼接字符串是不可缺少的,动态创建dom元素以及js操作数据都要拼接字符串,在es6出来之前,我们都通常 ...
- ES6中的模板字符串---反引号``
在react中,反引号``有特殊的含义. 如MDN中所述,模板字符串(Template literals)允许嵌入表达式,并且支持多行字符串和字符串插补特性.基本语法为以下几种: 其中第一行为最基本用 ...
- ES6 模板字符串Template String
1. 模板字符串简介: 顾名思义,模板字符串是用来定义一个模板是使用的,就像Vue,React中的template语法. 首先,先来了解一下template string的基本用法: 在ES5中,我们 ...
- ES6模板字符串【${}配合反单引号一起用】
先看看JavaScript中两个字符串的效果,就很容易知道模板字符串是个啥东西,其实一点也不新鲜.高级编程中,例如java里面的string.format就是干这个事情,诸如此类. 1. 概念理解 A ...
- 2、ES6结构赋值和模板字符串
ES6允许按照一定的模式,从数组和对象中提取值,这被称为结构,即解开数据的结构 1.数组的解构赋值 let [a,b] = [1,2] let [a,b,c=100] = [1,2] //c的默认值为 ...
- es6的新特性--模板字符串
这几天简单看了一下深入浅出es6这本书,感觉特实用,学习了一个新特性---模板字符串在项目开发中,拼接字符串是不可缺少的,动态创建dom元素以及js操作数据都要拼接字符串,在es6出来之前,我们都通常 ...
随机推荐
- enote笔记语言(4)(ver0.3)——“5w1h2k”分析法
章节:“5w1h2k”分析法 what:我想知道某个“关键词(keyword)”(即,词汇.词语,或称单词,可以是概念|专业术语|.......)的定义. why:我想知道事物发生的原因.“why ...
- swap() 函数实现的方法
swap()函数总结: 一.利用临时变量 1.引用(交换任意类型) template <typename T> void swap(T& x,T& y) { T tmp; ...
- 前端开发神器之chrome 综述
作为前端工程师,也许你对chrome开发工具不陌生,但也谈不上对各个模块有深入了解. 本文主要是为chrome开发工具使用这个系列做个开篇. 参考资料: 谷歌开发者: https://develope ...
- Android第三方开源图片裁剪截取:cropper
Android第三方开源图片裁剪截取:cropper 很多app都需要裁剪截取图片作为头像.logo之类,而cropper是github上的一个针对Android平台的.第三方开源图片裁剪截取项 ...
- 动物统计加强版 Trie 树
动物统计加强版 时间限制:3000 ms | 内存限制:150000 KB 难度:4 描述 在美丽大兴安岭原始森林中存在数量繁多的物种,在勘察员带来的各种动物资料中有未统计数量的原始动物的名单 ...
- springcloud(十一):服务网关Zuul高级篇
时间过的很快,写springcloud(十):服务网关zuul初级篇还在半年前,现在已经是2018年了,我们继续探讨Zuul更高级的使用方式. 上篇文章主要介绍了Zuul网关使用模式,以及自动转发机制 ...
- linux 获取经过N层Nginx转发的访问来源真实IP
linux 获取经过N层Nginx转发的访问来源真实IP 学习:http://blog.csdn.net/zhenzhendeblog/article/details/49702575 学习:http ...
- jQuery Validate 使用
jQuery Validate 使用 <script src="js/b/js/jquery.validate.js"></script> <styl ...
- SSH整合开发时Scope为默认时现象与原理
1.前提知识 1)scope默认值 进行SSH整合开发时,Struts2的action须要用spring容器进行管理,仅仅要涉及到类以bean的形式入到spring容器中.无论是xml配置还是使用注解 ...
- [PWA] Optimize Assets Delivery using preload and prefetch
By default, browsers load the assets in a render-blocking way. Modern browsers introduced prefetch a ...