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出来之前,我们都通常 ...
随机推荐
- Jenkins+Ant+Jmeter自动化集成测试实例
通过学习Jmeter自动化测试,接触到了Ant命令和其构建文件build.xml文件的编写,与此同时,通过将测试项目集成在jenkins上,进一步学习了jenkins的一些环境配置知识.以下是自己的初 ...
- Going Home HDU - 1533(最大费用最小流)
On a grid map there are n little men and n houses. In each unit time, every little man can move one ...
- 渗透实战(周六):Hydra&Metasploit暴力破解SSH登录口令
一. SSH服务开启前基础配置 1.1 修改配置文件
- hadoop2.3.0cdh5.0.2 升级到cdh5.7.0
后儿就放假了,上班这心真心收不住,为了能充实的度过这难熬的两天,我决定搞个大工程.....ps:我为啥这么期待放假呢,在沙发上像死人一样躺一天真的有意义嘛....... 当然版本:hadoop2.3. ...
- NFS 文件系统的搭建
教程: 一.配置linux内核: 进入打过at91补丁的linux2.6内核源代码树的根目录 make menuconfig进入内核配置程序. 1. Networking ---> Netwo ...
- Servlet中使用RequestDispatcher调派请求--include
一共有两种调派方式,一个是include用于包含进来,一个是forward,是转发出去. 这时先测试包含的include方式. Some.java: package cc.openhome; impo ...
- 洛谷——P2676 超级书架
https://www.luogu.org/problem/show?pid=2676#sub 题目描述 Farmer John最近为奶牛们的图书馆添置了一个巨大的书架,尽管它是如此的大,但它还是几乎 ...
- applicationcontext理解使用
Spring ApplicationContext 容器 Application Context 是 spring 中较高级的容器.和 BeanFactory 类似,它可以加载配置文件中定义的 bea ...
- LinkedList,ArrayList末尾插入谁效率高?
废话不多说,原因不解释.上測试代码: package com.letv.cloud.cdn.jtest; import java.io.IOException; import java.util.Ar ...
- swift 拼图小游戏
依据这位朋友的拼图小游戏改编 http://tangchaolizi.blog.51cto.com/3126463/1571616 改编主要地方是: 原本着我仁兄的代码时支持拖动小图块来移动的,我參照 ...