ES6学习笔记 篇二 字符串的用法与扩展

本文是一系列就阮一峰的《ECMAScript 6 入门》的学习笔记。
篇零：ES6学习笔记 篇零 变量声明
篇一：ES6学习笔记 篇一 赋值（传值 引用 解构）

转义字符

除了普通的可打印字符以外，一些特殊有特殊功能的字符可以通过转义字符的形式放入字符串中：

题外话：简单复习一下编码的知识：
8位（bit）= 1字节（byte）       =>      8b = 1B
1kB = 1024B

它对世界上大部分的文字系统进行了整理、编码，使得电脑可以用更为简单的方式来呈现和处理文字。

大家都知道计算机的最底层实现是靠二进制，也就是1和0。最早的时候，用晶体管的明灭（0，1）来做计算，当时规定8个晶体管的状态为一“字节”，而这八位的字节也就共可以组合出256(2^8)种不同的状态。
0×20以下的字节状态称为”控制码”，又将剩下的位置编码城空格逗号分号等符号和大小写字母。但各国文字符号等多有不同，一些制表符、特殊字符等也被编入其中，128 到255这一页的字符集被称”扩展字符集“。
gb2312就是汉字的一种编码方式。用这种方式存储、解读的文字将会展现出此汉字规则下字符。
所以，编码方式，就是计算机展示字符所对应的不同规则。按照规则展示出相应的字符。

模板字面量

模板字面量/Template literals 是允许嵌入表达式的字符串字面量。你可以使用多行字符串和字符串插值功能。

其实就是我们可以更方便的在一个固定格式的字符串中变更部分信息。

例如在url中使用。
eg：

<Link to={`/mainpage/profilechange/${userid}`}> 更改昵称 </Link>

let name = 'Molly', age = '22';`I'm ${name}, I'm ${age} years old.`output--> 'I'm Molly, I'm 22 years old.'

它的标志就是整个字符串用反引号`包裹，而不是用单引号。在变量的部分使用${}包裹。

①如果模板的字符串中需要展示反引号`，则需要用反斜杠\作为转译（如同正则的反斜杠转译）。
eg:

let greeting = `\`Hello\` World!`;console.log(greeting);
output--> `Hello` World!

②如果${}包裹中的变量名未定义，会报错。xxx is not defined。

③如果大括号内为字符串，那么将直接输出此字符串。
eg：

`Hello ${'Molly'}`output--> 'Hello Molly'

④如果大括号内为对象，则会自动调用toString()方法。
eg:

`Hello ${['Molly', 'Fool']}`output--> 'Hello Molly,Fool'`Hello ${{'1': 'Molly', '2': 'Fool'}}`output--> 'Hello [object Object]'

⑤可以多层嵌套
eg:

let a = 'Molly';let b = 'Fool';`Hello ${a,`${b}`}`;

多行字符串

我们都知道字符串中是不允许换行的，比如：

var str = '1223
234';
VM542:1 Uncaught SyntaxError: Invalid or unexpected token

如果需要换行，那就需要用到转译字符，\n。
但在模板字符串中，我们可以用这样的方法：

console.log(`string text line 1string text line 2`);

output-->string text line 1string text line 2

反引号包裹字符串，可以在字符串内自行换行。

表达式插补

①在字符串中进行一些js的操作，我们之前是这么做的：

var a = 5;var b = 3;
console.log('Lily is ' + (a + b) + 'years old' + ' and \nher brother is ' + (a * b) + '.');

output-->'Lily is 8years old and 
her brother is 15.'

我们可以使用反引号进行这样优雅的操作：

var a = 5;var b = 3;console.log(`Lily is ${a + b} years old and
her brother is ${a * b}`);

output-->
Lily is 8 years old and
her brother is 15

②我们还可以直接调用对象中的属性：

let obj = {x: 1, y: 2};`${obj.x + obj.y}`;

output--> ’3‘

反引号的使用让我们在字符串中使用一些简单的js操作看起来十分的优雅简洁。

③模板字符串之中我们还可以直接调用函数：

function fn() {  return "Hello World";
}`Amy said '${fn()}' !`output-->'Amy said 'Hello World' !'

以上是一些常用的字符串的用法。
本系列会持续更新。

作者：MollyFool
链接：https://www.jianshu.com/p/42cc8a0e1997