es6——模板字符串

模板字符串

`进行处理的字符串或者 ${变量（常量）或者表达式（≠语句）}`

        // 原先的字符串要实现转行或空格等特殊行为，需要用对应的特殊字符进行转义const str = '今天\n下暴雨';console.log(str);// es6提供模板字符串，从而实现对字符串的灵活处理const str1 = `今天下暴雨`;console.log(str1);// 模板字符串 浏览器可识别模板字符串中的任何特殊字符——包括转行、空格.....const str11 = `今天下暴雨`;console.log(str11);const str111 = `今天下暴雨`;console.log(str111);// 内容为表达式时,浏览器会解析模板字符串中的表达式const str_ex = `${1+1}`;console.log(str_ex);// 内容为语句时// 浏览器仍会解析语句，并执行语句// 但解析和执行的行为会脱离模板字符串的范围// 当前语句在模板字符串中被返回undefinedfunction fn() {console.log("我是fn函数")};const str_lan = `${fn()}`;console.log(str_lan);

输出结果如下:

标签模板字符串

对模板字符串进行标记

格式：标记名`模板字符串`

标记是一个函数时，函数参数如下：

参数1：被插值分割的字符串组成的数组

后续参数们：所有插值

        function fun(param1, param2, param3) {console.log(param1);console.log(param2);console.log(param3);};let name1 = "阿芳";let name2 = "阿丽";let tagStr = fun `姐妹1${name1}姐妹2${name2}。`;

输出结果：

标签模板字符串的自定义

        function fun(parts) {const values = Array.prototype.slice.apply(arguments).slice(1)let str = "";for (let i = 0; i < values.length; i++) {str += `${parts[i]} : ${values[i]};`;// 拼接最后的字符串部分if (i == values.length - 1) {str += parts[i + 1]};};return str;};let name1 = "阿芳";let name2 = "阿丽";let tagStr = fun `姐妹1${name1}姐妹2${name2}。`;console.log(tagStr); //  姐妹1 : 阿芳;姐妹2 : 阿丽;。

es6——模板字符串相关推荐

后端字段为null，前端使用ES6模板字符串进行展示
项目需求:后端字段为null,前端使用ES6模板字符串展示为空未处理前效果: // ES6的模板字符串可写表达式<template #default="{ row }"&g ...
[ 前端开发 ] ES6模板字符串
ES6模板字符串模板字符串是 ES6 的新特性,他的作用是减少了字符串的拼接操作,提高了程序的可读性接下来看一个栗子
重学ES6 模板字符串
在两三年前,jQuery还是比较主流的开发技术,当我们要为页面添加DOM时,一般,我们是这样写的 $("#container").append('Today is <b> ...
ES6模板字符串【${}配合反单引号一起用】
转自: https://www.cnblogs.com/shihuc/p/10238511.html 先看看JavaScript中两个字符串的效果,就很容易知道模板字符串是个啥东西,其实一点也不新鲜. ...
高级JavaScript #ES6(模板字符串,let,箭头函数,forof,参数增强,解构,class,promise)
模板字符串 1.模板字符串: 只要拼接字符串都用模板字符串代替+a.整个字符串包裹在一对儿反引号 ` ` 中b.反引号``中支持换行 c.反引号中需要动态生成的内容必须放在${}里d. ${}里: ...
ES6 模板字符串 ``
参考原文链接 1. 使用JavaScript输出字符串,通常是下面这样的: console.log("He is <b>"+person.name+"< ...
ES6模板字符串的扩展
1.模板字符串的扩展 1.1传统的Jquery方法 <div class="content"></div><script>let name = ...
es6模板字符串中标签模板作为参数时产生空元素的问题
当模板字符串作为标签模板使用时,标签函数接受到的参数分别为(arr,-values) arr:模板字符串中所有那些没有变量替换的部分 -values:各个变量替换后的值即 let a = 'Oh!' ...
es6模板字符串中循环遍历数据踩坑
应该很少有这种需求,需要在模板字符串利循环遍历数据,现在框架都有自己模板语法. 我这里踩的坑是,我在模板字符串中用forEach,map遍历循环时,返回值一直是一个undefined 用for循环re ...
js es6 模板字符串和使用
模板字符串描述: 模板字符串使用反引号 (``) 来代替普通字符串中的用双引号和单引号.模板字符串可以包含特定语法(${expression})的占位符.占位符中的表达式和周围的文本会一起传递给一个默 ...

es6——模板字符串

es6——模板字符串相关推荐

最新文章

热门文章