先看看JavaScript中两个字符串的效果,就很容易知道模板字符串是个啥东西,其实一点也不新鲜。高级编程中,例如java里面的string.format就是干这个事情,诸如此类。

1. 概念理解

A.老式做法

var ohello='good good day, day day good'
var oworld='please look ' + '"' + ohello + '"' + ', cool style, please enjoy it'
console.info(oworld)

B.新式做法

var hello='good good day, day day good'
var world=`please look "${hello}", cool style, please enjoy it`
console.info(world)

是不是新式做法简单了很多,这种表达方式是ES6提出的模板字符串方式。

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

2. 模板字符串中有没有变量不是刚需

var str1 = `hello world`
console.log(str1)

字符串模板方便了将变量的值嵌入到模板字符串中

3. 如果使用模版字符串输出多行字符串,所有的空格和缩进都会被保存在输出中!!

console.log(`No matter\` what you do,

I trust you.
。。。。
呵呵`)

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

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

ES6模板字符串【${}配合反单引号一起用】的更多相关文章

  1. ES6模板字符串

    ES6支持模板字符串,简单写法如下 //html界面 <!DOCTYPE html> <html> <head> <meta charset="ut ...

  2. es6 模板字符串

    模板字符串 提供构造字符串的语法糖,在 Prel/python 等语言中也都有类似特性. 1.反引号模板,可以换行 2.反引号模板,可以嵌套 用+``来嵌套 好处:语法更加简洁 var name=&q ...

  3. linux 在执行命令过程中,反单引号(`)这个符号代表的意义为何?

    在一串命令中,在`之内的命令将会被先执行,而且执行出来的结果将作为外部的输入信息.例如:uname -r 会显示出目前的内核版本,而我们的内核版本在/lib/modules里面,因此.你可以先执行un ...

  4. ES6 -- 模板字符串(反单引号)

    1)直接使用变量 // before var str = 'test'; console.log(str + "123"); // now var str = 'test'; co ...

  5. es6 模板字变量和字符串占位符

    开发者一直在寻找一种创建多行字符串的形式,但要使用单引号双引号字符串一定要在同一行才行. 老办法: 还有其他办法,虽然能实现,但是太啰嗦 es6模板自变量 使用反撇好(`)替换了单双引号 反撇好中的所 ...

  6. 粗看ES6之字符串

    标签: javascript es6 字符串新增特性 新增二个方法 - startsWith/endsWith 字符串模板 - 反单引号的应用 startsWith 判断字符串以是否以某某开头,返回一 ...

  7. vue 事件监听和es6模板语法

    es6模板语法的反引号是通过左上角的飘字符弄出来了,学废了吗?

  8. 深入浅出ES6(四):模板字符串

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 反撇号(`)基础知识 ES6引入了一种新型的字符串字面量语法,我们称之为模板字符 ...

  9. es6的新特性--模板字符串

    这几天简单看了一下深入浅出es6这本书,感觉特实用,学习了一个新特性---模板字符串在项目开发中,拼接字符串是不可缺少的,动态创建dom元素以及js操作数据都要拼接字符串,在es6出来之前,我们都通常 ...

随机推荐

  1. 前端特效demo | 一起围观 10 种创意时钟

    时钟动画应用非常广泛,我们经常会看到一些相当个性化的HTML5时钟动画.今天我们向大家分享 10 款形态各异的超时尚时钟动画,其中有圆盘时钟.创意时钟.电子时钟等,希望大家会喜欢. 文内附有时钟效果代 ...

  2. AOP异常报错1

    Error creating bean with name 'org.springframework.aop.support.DefaultBeanFactoryPointcutAdvisor#0' ...

  3. javascript 字符串处理

    ---恢复内容开始--- 最近几次参加前端实习生招聘的笔试,发现很多笔试题都会考到字符串的处理,比方说去哪儿网笔试题.淘宝的笔试题等.如果你经常参加笔试或者也是一个过来人,相信你也跟我一样,发现字符串 ...

  4. [转载] java多线程总结(二)

    转载自:http://www.cnblogs.com/lwbqqyumidi/p/3817517.html 作者:Windstep 四.Java多线程的阻塞状态与线程控制 上文已经提到Java阻塞的几 ...

  5. 关于SpringMVC的配置流程以及一些细节

    首先说道SpringMvc是什么,SpringMVC是Spring框架里面的一个子框架,它对网站前后端的代码分层做了一套实现,这套实现给我们带来了几个好处,首先第一,SpringMVC实现了一个请求对 ...

  6. failed to start process with commandline '%LAUNCHER_PATH% %LAUNCHER_ARGS%', ErrorCode = '0x80070002

    在dotnet core进行开发的时候,需要开发目录直接iis进行部署,然而启动的时候,报异常,我们查看windows下的应用日志发现有个这样的错误信息 Application 'MACHINE/WE ...

  7. re模块(正则表达式)

    re,findall("匹配正则","内容") #所有满足条件的结果都返回到一个列表里 ret = re.search(“匹配规则”,“内容”) #返回 匹配到 ...

  8. 微信公众号服务器配置url二次修改

    最近微信公众号配置的服务器的域名和云服务到期,就想着更换到别的域名下的服务器:修改的时候出现token验证失败: 我同样的微信签名验证代码在以前服务器上是没问题的,但是修改到新的域名地址时候,总是提醒 ...

  9. Dapp的PVP发模式--magic-maze-2d游戏解读

    前言: 未来基于Dapp的游戏可能会多起来吧, 尤其是博彩类游戏, 由于区块链匿名特性, 加之数字货币不受国家监控, 几乎成了一个法外之地. 大量游戏团队都往之涌入. 今天讲讲当前Dapp的一种游戏模 ...

  10. 项目启动失败,异常代码(StandardEngine[Catalina].StandardHost[localhost].StandardContext[/credit]]) ,dataSource 也报错

    问题:tomcat 项目启动失败(有多个springboot项目)! 28-Apr-2019 12:01:12.162 严重 [localhost-startStop-1] org.apache.ca ...