es6 字符串模板拼接

字符串拼接是在日常开发中必不可少的一个环节。

注意：字符串可以用单引号''，或者""双引号，出于方便大家理解，文章以下内容统一使用单引号''！

如果只是一个字符串和一个变量拼接，使用传统的字符串拼接就没什么问题，只需要一个+号和一个''号就好了；但是有时候会有多个字符串与变量拼接，那么就会有一大堆的+号和''号，造成代码不美观。

传统的字符串拼接

var name = 'moss';
var age = 18;
console.log('My name is ' + name + ' and I am ' + age + ' years old');
// 打印结果：My name is moss and I am 18 years old

es6的模板字符串解决了以上问题

用两个反单引号``包裹的字符串就是字符串模板，在字符串模板中可以使用${}符号来引用变量。（反单引号``在Tab按键上面）

es6的模板字符串拼接

var name = 'moss';
var age = 18;
console.log(`My name is ${name} and I am ${age} years old`);
// 打印结果：My name is moss and I am 18 years old

拼接html字符串的话，也是使用一个``就可以搞掂了！

var html = `<ul><li>第一行</li><li>第二行</li>
</ul>`

es6 字符串模板拼接相关推荐

ES6 - 字符串模板与新增字符串方法
字符串模板解决痛点:简化字符串拼接,比如innerHTML,url等语法格式:反引号 let name = 'murphy'; let age = 18; console.log(`名字${nam ...
ES6—字符串模板引擎
字符串模板引擎 ES5中的字符串缺乏多行字符串.字符串格式化.HTML转义等特性. 而ES6通过模板字面量的方式进行了填补,模板字面量试着跳出JS已有的字符串体系,通过一些全新的方法来解决问题. 1 ...
es6 字符串模板随手记
错误正确
ES6学习笔记之字符串模板(巩固复习)
ES6字符串模板这个举个例子,先大概了解一下什么是字符转模板 <script>let name='Kobe Bryant'let birthday="1978.8.23&quo ...
ES6（二）——字符串模板、标签模板字符串、函数的默认参数、剩余参数、数组对象的展开语法、数值的表示、Symbol
一.字符串模板基本使用在ES6之前,如果我们想要将字符串和一些动态的变量(标识符)拼接到一起,是非常麻烦和丑陋的(ugly). ES6允许我们使用字符串模板来嵌入JS的变量或者表达式来进行拼接: 首 ...
es6html模板,js 字符串模板 ES6
字符串模板 //js中单双引号字符串不能解析变量 var num = 100; var html = " " + num + ""; console.log ...
深入浅出ES6：模板字符串（`和‘）
反撇号(`)基础知识 ES6引入了一种新型的字符串字面量语法,我们称之为模板字符串(template strings).除了使用反撇号字符 ` 代替普通字符串的引号 ' 或 " 外,它们看起 ...
ES6 标签模板与模板字符串
模板字符串模板字符串使用反引号 () 来代替普通字符串中的用双引号和单引号.模板字符串可以包含特定语法(${expression})的占位符.占位符中的表达式和周围的文本会一起传递给一个默认函数,该 ...
初步探究ES6之字符串模板和剩余参数，默认参数
本文介绍一下字符串模板以及剩余参数,默认参数的概念以及使用. 先来说说字符串模板. 字符串模板 ES6中允许使用反引号 ` 来创建字符串,此种方法创建的字符串里面可以包含由美元符号加花括号包裹的变量$ ...

es6 字符串模板拼接

es6 字符串模板拼接相关推荐

最新文章

热门文章