这是以前的字符串。。双引号,单引号。毫无区别

有时候在字符串里面写一些标签。

排版不好看 我就想回车一下。这样写虽然是好看。但是语法就报错了。es5的字符串不支持换行。我只想是想让它排版的好看一点。

js想的一个法子是在每一行加一些斜线用来转义


那么这样的代码有没有问题呢?再写一个一样的字符串。然后在后面加上多个空格,这就不是在结尾的地方加了斜线
这里最大的问题是,如果你后面有空格,你的人眼是看不出来的


这样就会报语法错误。

想要找到后面有没有空格要找很久,除非你在每一个地方双击一下

这里双击有空格

用加号的形式,但是每一行代码都要用双引号,

es6的语法糖,反引号。

每一行后面都是回车,没有空格的

附赠功能,

把我是一个好人放在两个p之间

用replace的方式

另外一种方式。通过控制加号的排版,来达到整体排版

把变量插到字符串里面-字符串插值

2



加一个函数来处理。函数后面马上接着这个新的字符串


可以看到这个函数是三个参数。

这是第一个参数,

第一个参数就是三个字符串的数组,
第二个参数是第一个变量,
第二个参数是第二个变量。


把name改成圆圆


也就是说在模板字符串前面加函数,可以让你又一次机会根据插入的变量的值来修改这个模板字符串。最终是否要展示啥。
原本你是要展示圆圆是一个人,现在输出的就是圆圆是一个坏人,因为这个函数里去做了一个判断。

这有什么用?

如果你用React那么就会用到一个非常注明的库叫做 styled-component

https://github.com/styled-components/styled-components
我们来看他的语法。styled.h1 这个h1就是一个函数。你一旦调用styled.h1那么你后面就要给我一个多行字符串。
它会把里面的css作为内联样式写到一个h1的标签里面。然后把h1标签的字符串返回回来。

结束

ES6深入浅出-3 三个点运算 & 新版字符串-2. 新版字符串的更多相关文章

  1. ES6深入浅出-3 三个点运算 & 新版字符串-1.函数与对象的语法糖

    主要讲的内容 时间充裕的话就讲,模板字面量 默认参数值 首先讲es6之前,我们是怎么做的.例如我们要写一个求和的函数, 请两个参数的和,但是如果有的人就是穿一个参数呢? 那么b没有传值,b的值是多少呢 ...

  2. ES6深入浅出_汇总贴

    H:\BaiDu\ES6深入浅出-wjw ES 6 新特性一览:https://frankfang.github.io/es-6-tutorials/ 我用了两个月的时间才理解 let https:/ ...

  3. es6新语法系列,查找字符串,模板字符串

    一.模板字符串: ES6引入了一种新型的字符串字面量语法,我们称之为模板字符串(template strings).除了使用反撇号字符 ` 代替普通字符串的引号 ' 或 " 外,它们看起来与 ...

  4. 三张图彻底了解Java中字符串的不变性

    转载: 三张图彻底了解Java中字符串的不变性 定义一个字符串 String s = "abcd"; s中保存了string对象的引用.下面的箭头可以理解为"存储他的引用 ...

  5. 函数原型属性-JavaScript深入浅出(三)

    前两次总结了JavaScript中的基本数据类型(值类型<引用类型>,引用类型<复杂值>)以及他们在内存中的存储,对内存空间有了一个简单的了解,以及第二次总结了this深入浅出 ...

  6. 原型那些事 - JavaScript深入浅出(三)

    前两次总结了JavaScript中的基本数据类型(值类型<引用类型>,引用类型<复杂值>)以及他们在内存中的存储,对内存空间有了一个简单的了解,以及第二次总结了this深入浅出 ...

  7. Java开发笔记(三十七)利用正则串分割字符串

    前面介绍了处理字符串的常用方法,还有一种分割字符串的场景也很常见,也就是按照某个规则将字符串切割为若干子串.分割规则通常是指定某个分隔符,根据字符串内部的分隔符将字符串进行分割,例如逗号.空格等等都可 ...

  8. Python第三天 序列 5种数据类型 数值 字符串 列表 元组 字典 各种数据类型的的xx重写xx表达式

    Python第三天 序列  5种数据类型  数值  字符串  列表  元组  字典 各种数据类型的的xx重写xx表达式 目录 Pycharm使用技巧(转载) Python第一天  安装  shell ...

  9. ES6新特性三: Generator(生成器)函数详解

    本文实例讲述了ES6新特性三: Generator(生成器)函数.分享给大家供大家参考,具体如下: 1. 简介 ① 理解:可以把它理解成一个函数的内部状态的遍历器,每调用一次,函数的内部状态发生一次改 ...

随机推荐

  1. rocketmq那些事儿之入门基础

    分布式消息队列中间件作为高并发系统的核心组件之一,能够帮助业务系统解构提升开发效率和系统稳定性,其复杂性可见一斑,作为核心组件,有必要去深入了解学习 前言 分布式消息队列中间件主要具有以下优势: 削峰 ...

  2. JVM那些事儿之内存区域

    相信绝大多数java开发者或多或少的都应该知道jvm,但是有多少人又深入去了解过,笔者深感自身能力的不足,去看了些资料,觉得还是有必要整理下自己的学习记录,时常回头看看,多看多实践提升自己的能力,故开 ...

  3. (java)selenium webdriver学习,选择模块,点击下一页,获取当前url

    selenium webdriver学习,选择模块,点击下一页,获取当前url 查找下一页有多种方法,这里列举两种: isSelected()函数用于判断是否点击选中,返回Boolean类型 impo ...

  4. Ubuntu安装Apache 2.4.7常见问题解答

    环境:Apache 2.4.7 on Ubuntu 14.04 启动apache服务报错:Unknown Authz provider: ip 进入mod模块目录 cd /etc/apache2/mo ...

  5. Dynamics 365 目录

    Dynamics 365 目录 1.Dynamics 365 on-premises 安装 2.Dynamics 365 安装过程中的问题 2.1Dynamics 365 安装问题——无法访MSCRM ...

  6. 什么是ARP协议?

    ARP协议,全称“Address Resolution Protocol”,中文名是地址解析协议, 使用ARP协议可实现通过IP地址获得对应主机的物理地址(MAC地址). 在TCP/IP的网络环境下, ...

  7. SPA项目开发--左侧树加首页导航

    SPA项目开发--左侧树以及首页导航 1. Mock.js 前后端分离之后,前端迫切需要一种机制,不再需要依赖后端接口开发,而今天的主角mockjs就可以做到这一点    Mock.js是一个模拟数据 ...

  8. DVWA命令注入扣动分析

    本周学习内容: 1.学习web应用安全权威指南: 2.观看安全学习视频: 实验内容: 进行DVWA命令注入漏洞 实验步骤: Low 1.打开DVWA,进入DVWA Security模块将 Level修 ...

  9. learning java Math类

    output: //取整,返回小于目标数的最大整数System.out.println(Math.floor(-1.2));// 取整,返回在于目标数的最大整数System.out.println(M ...

  10. C 指针常量 和常量指针 指向常量的指针常量的使用

    #include <stdio.h> /* 指针常量 和常量指针 指向常量的指针常量 */ int main() { int a = 100; int b =200; int* const ...