2019-08-03 ES6新特性模板字符串 ${}的灵活使用

2019-08-03  本文已影响0人  本泽锅

大家好我本泽锅又来了,这次来讲讲ES6的模板字符串

首先来理解下概念
之前做字符串的拼接
以前的写法

var a = 'hellow world'
var b = '你好' + '"' + a + '"'
console.log(b)

打印结果:你好"hellow world"

 var a = 'hellow world'
  //   var b = '你好' + '"' + a + '"'
 var b = `你好${a}`
console.log(b)

打印结果:你好"hellow world"
这种写法简洁了很多,不用在拼接+ “ ” '' 诸如此类的,这就是es6的模版字符串写法

模板字符串(template string)是增强版的字符串,用反引号(`)标识。它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。变量的获取方式是${varName},使得字符串模板定义简单化。

还有其他一些特性
如果使用模版字符串输出多行字符串,所有的空格和缩进都会被保存在输出中

console.log(`你好\` how are you,

I am fine.
                               。。。。
谢谢`)

打印结果
你好` how are you,

I am fine.
。。。。
谢谢

在${}中的大括号里可以放入任意的JavaScript表达式,及引用对象属性(类似Spring SpEL表达式),还可以进行运算。

var x=100;
var y=123;
console.log(`x=${x++},y=${x+y}`);

打印结果
x=100,y=224

上一篇 下一篇

猜你喜欢

热点阅读