ES6 模板字面量
模板字面量 解决的问题
1.多行字符串 一个正式的多行字符串的概念
2.基本的字符串格式化 将变量的值嵌入字符串的能力
3.HTML转义 向HTML插入安全转换后的字符串的能力
(1)基础语法

相当于使用` ` 反撇号代替了单/双引号,和普通字符串无差异
(2)多行字符串
ES6之前换行:
在新行最前方添加反斜杠(\)承接上一行的代码,

但是字符串并没有换行显示,因为反斜杠只是代表该行的延续,这是JavaScript的一个语法bug
如果想输出新的一行,需手动加换行符

\n 后面的反斜杠依然代表该行延续;但由于这是JavaScript的bug,不推荐使用
数组或字符串拼接换行


ES6 中简化多行字符串
使用反撇号修饰,只需要直接换行就行,在反撇号中所有空白符为字符串一部分,message长度为16
也可以使用\n来指明插入新行的位置
let message = `Multiline\nstring`;
字符串占位符
在模板字面量中,可以把任何合法的JavaScript表达式嵌入到占位符并将其作为字符串的一部分输出到结果中
占位符由一个左侧的${ 和右侧的 } 符号组成,中间可以包含任意的JavaScript表达式

模板字面量可以访问作用域中所有可访问的变量,无论在严格模式还是非严格模式下,嵌入未定义的变量都会抛出错误
嵌入模板字面量
标签模板
标签指的是在模板字面量的第一个反撇号(`)前方标注的字符串
标签可以是一个函数
接收参数:
首先是一个literals数组,包含以下元素:
(1)第一个占位符前的空字符串("
(2)第一、二个占位符之间的字符串
(3)第二个占位符后面的字符串,
之后所有的参数都是每一个占位符的解释值。
在模板字面量中使用原始值String.raw
获取\n的原生形式"\\n" (反斜杠与n字符,n字符需要\转义)
ES6 模板字面量的更多相关文章
- ES6模板字面量
前面的话 JS 的字符串相对其他语言来说功能总是有限的,事实上,ES5中一直缺乏许多特性,如多行字符串.字符串格式化.HTML转义等.ES6通过模板字面量的方式进行了填补,模板字面量试着跳出自己JS已 ...
- ES6入门四:对象字面量扩展与字符串模板字面量
简洁属性与简洁方法 计算属性名与[[prototype]] super对象(暂时保留解析) 模板字面量(模板字符串) 一.简洁属性与简洁方法 ES6中为了不断优化代码,减低代码的耦合度在语法上下了很大 ...
- ES6躬行记(4)——模板字面量
模板字面量(Template Literal)是一种能够嵌入表达式的格式化字符串,有别于普通字符串,它使用反引号(`)包裹字符序列,而不是双引号或单引号.模板字面量包含特定形式的占位符(${expre ...
- ES6里关于模板字面量的拓展
JS 的字符串相对其他语言来说功能总是有限的,事实上,ES5中一直缺乏许多特性,如多行字符串.字符串格式化.HTML转义等.ES6通过模板字面量的方式进行了填补,模板字面量试着跳出JS已有的字符串体系 ...
- es6对象字面量增强
相对于ES5,ES6的对象字面量得到了很大程度的增强.这些改进我们可以输入更少的代码同时语法更易于理解.那就一起来看看对象增强的功能.对象字面量简写(Object Literal Shorthand) ...
- 学习熟悉箭头函数, 类, 模板字面量, let和const声明
箭头函数:https://blog.csdn.net/qq_30100043/article/details/53396517 类:https://blog.csdn.net/pcaxb/articl ...
- ES6:字面量的增强写法
以前对象字面量的写法: 属性的增强写法: ES6中可以写成: 方法的增强写法 ES6中可以写成: ~~~~~ END ~~~~~
- JS:关于JS字面量及其容易忽略的12个小问题
简要 问题1:不能使用typeof判断一个null对象的数据类型 问题2:用双等号判断两个一样的变量,可能返回false 问题3:对于非十进制,如果超出了数值范围,则会报错 问题4:JS浮点数并不精确 ...
- [译]ES6新特性:八进制和二进制整数字面量
原文:http://whereswalden.com/2013/08/12/micro-feature-from-es6-now-in-firefox-aurora-and-nightly-binar ...
随机推荐
- asp.net core 中间件应用
中间件是一种装配到应用管道以处理请求和响应的软件. 每个组件: 选择是否将请求传递到管道中的下一个组件. 可在调用管道中的下一个组件前后执行工作. 请求委托(Request delegates)用于生 ...
- VSCode Vue文件格式化
参考文档:https://vuejs.github.io/vetur/formatting.html 自从将VSCode更新之后,vue文件的html格式化就失效了,而且vue文件中的js ,css格 ...
- pkusc2018数学题
题解: 还是很水的 复制个题面过来 好吧我不会复制 https://www.cnblogs.com/skylee03/p/9127130.html 题目链接 第一题是个傻逼题 初中数学题随便凑凑 ( ...
- Android动画模式
在Android中,有两种动画模式:Tween Animation(渐变动画)和Frame Animation(帧动画).渐变动画是通过对场景里的对象不断做图像变换(平移.缩放.旋转等)来产生动画效果 ...
- Zabbix微信报警触发
(1) 企业应用-创建应用 1.除了对个人添加微信报警之外,还可以添加不同管理组,接受同一个应用推送的消息, 成员账号,组织部门ID,应用Agent ID,CorpID和Secret, ...
- 关于ubuntu的ssh远程登录的问题
一. 安装ssh(参考:http://liuyifan789.iteye.com/blog/2068263) sudo apt-get install openssh-server openssh-c ...
- 扩展中国剩余定理 (exCRT) 的证明与练习
原文链接https://www.cnblogs.com/zhouzhendong/p/exCRT.html 扩展中国剩余定理 (exCRT) 的证明与练习 问题模型 给定同余方程组 $$\begin{ ...
- NOIP2016提高组Day1T2 天天爱跑步 树链剖分 LCA 倍增 差分
原文链接https://www.cnblogs.com/zhouzhendong/p/9275606.html 题目传送门 - 洛谷P1600 题目传送门 - LOJ#2359 题目传送门 - Vij ...
- Mysql 查询实现成绩排名
Mysql 查询实现成绩排名,相同分数名次相同,类似于rank()函数 近日系统要实现总分成绩排名,而且相同分数的学生排名要一样,在网上搜了一圈,没有找到合适的方法,只能靠自己实现了,这里提供两种方法 ...
- Linux常用命令行补充——持续更新
1.查看文件夹大小 =>ls -lht 路径 ls -lht /opt/jars 2.查看文件大小 =>du -sh / du -sh /opt/jars/calllog.csv 3.编辑 ...