资讯专栏INFORMATION COLUMN

ES6系列文章 模板字符串

woshicixide / 3028人阅读

摘要:为我们提供了模板字符串,语法使用反引号。模板字符串具有以下三个优点多行文本字符串中插入变量字符串中插入表达式基本语法模板字符串和的字符串的声明一样。总结模板字符串就是这么的简单这么的好用。

ES6为我们提供了模板字符串,语法使用反引号`。模板字符串具有以下三个优点:

多行文本

字符串中插入变量

字符串中插入表达式

基本语法

模板字符串和 ES5的字符串的声明一样。

// ES5
var name = "xixi";
console.log(name);// xixi

// ES6
let name4ES6 = `一步`;
console.log(name4ES6);// 一步
多行文本

在Jquery 盛行的年代,我们经常会拼接 html 片段再进行节点替换。写一段 ES5的代码大家体会一下:

var str = ""
+ "
啦拉拉
" + "
xixixi
" + ""; console.log(str);//
啦拉拉
xixixi

ES6支持多行文本,上面的代码实现起来就容易多了。

let str4ES6 = `
    
啦拉拉
xixixix
`; console.log(str4ES6);
可以插入变量或表达式
// ES5
var name = "xixi";
var age = 27;
var info = "my name is " + name + " , age is " + age + ".";
console.log(info);// my name is xixi , age is 27.

ES6的模板字符串实现起来就容易好多。关键语法${},其中可以插入任何的 js 表达式。

let name = "xixi";
let age = 27;

let info = `my name is ${name}, my age is ${age}. just a test ${1 + 10}!`;
console.log(info);// my name is xixi, my age is 27. just a test 11!
总结

ES6模板字符串就是这么的简单这么的好用。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/88873.html

相关文章

  • ES6 Features系列:Template Strings & Tagged Templ

    摘要:由两部分组成模板起始符,称为沉音符反引号,其内容被识别为字符串模板。其实这是通过属性操作中的结果,也就是说属性将对控制符进行转义从而实现按照普通字符输出。的语法是紧跟在后面,两者间不能有空格或制表符等。 1. Brief ES6(ECMAScript 6th edition)于2015年7月份发布,虽然各大浏览器仍未全面支持ES6,但我们可以在后端通过Node.js 0.12和io....

    MyFaith 评论0 收藏0
  • Web前端模板引擎の符串模板

    摘要:这是一个系列文章,将会介绍目前前端领域里用到的三种模板引擎技术,它们分别是基于字符串的模板基于操作的模板基于虚拟的模板本文是这个系列的第一篇,着重介绍基于字符串的模板引擎的实现原理,分析它的优点缺点以及使用的场景。 这是一个系列文章,将会介绍目前Web前端领域里用到的三种模板引擎技术,它们分别是: 基于字符串的模板 基于Dom操作的模板 基于虚拟Dom的模板 本文是这个系列的第一篇...

    Pluser 评论0 收藏0
  • ES6 系列模板符串

    摘要:最终的代码如下第二版假设有这样一段为了保持可读性,我希望最终输入的样式为其实就是匹配每行前面的空格,然后将其替换为空字符串。 基础用法 let message = `Hello World`; console.log(message); 如果你碰巧要在字符串中使用反撇号,你可以使用反斜杠转义: let message = `Hello ` World`; console.log(mes...

    Travis 评论0 收藏0
  • 《深入理解ES6》笔记——符串和正则表达式(2)

    摘要:本章主要讲个知识点,字符串正则表达式字符串字符串是大原始数据类型。提供的标准形式,接受一个可选的字符串参数,指明应用某种标准形式。如果在字符串中检测到指定文本,返回,否则。字符串内插入反撇号的方式。 相比较于第一章变量的声明,这一章的内容有了一点深度提升,但还不至于很难理解。本章主要讲2个知识点,字符串、正则表达式 字符串 字符串(String)是JavaScript6大原始数据类型。...

    guqiu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<