ES6快速入门

变量声明

1. let命令：与var相似，但只在let命令所在的代码块内有效

   • 不能重新声明，不存在变量提升

   • 只能在当前块级作用域内使用，即循环内使用，不影响循环外

   • 存在暂时性死区（变量声明语句之前，变量无法使用；变量声明语句之后，无法重复声明）

2. const命令：声明一个只读的常量，一旦声明，常量的值就不能改变

   • 在声明时就要赋值，不然会报错

   • 其他与let一致

   • 本质上是指向的那个地址不能改变，而地址指向的那个数据可以改变

解构赋值

ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。按照对应位置，对变量赋值。只要等号两边的模式相同，左边的变量就会被赋予对应的值。

1. 如果解构失败就会得到undefined

2. 允许设置默认值，当赋值结果为undefined就会触发默认值；null不会触发

字符串的扩展

模板字符串

• 新的声明字符串的方式：``;

• 多行字符串：在内容中可以直接出现换行符

• 嵌入变量：可以之间在字符串中添加${}，并将变量或者函数写入花括号内，可解析变量；-->字符串拼接

• {}内的变量没有声明就会报错

• 可嵌套

标签模板

跟在一个函数后面可以 调用函数 来处理 模板字符串；

alert`hello`
//相当于
alert(['hello']);

数值的扩展

二进制和八进制

1. 二进制0b(0B)和八进制0o（0O）十六进制0X（0x）；

2. 将前缀为0b和0o的字符串转为十进制时，要使用Number方法

数值分隔符

• 可以使用分隔符来分隔数值。

• 其他进制的数值也可以使用分隔符

不能使用分隔符的情况：

• 但不能作为开头和结尾

• 分隔符不能连接在一起

• 小数点前后不能有分隔符

• 科学计数法中，表示指数e和E前后不能有分隔符

• 分隔符不能紧跟着进制的前缀

字符串转数字的函数不能处理分隔符

在数据存储时也不会将分隔符存储

新增方法

• Number.isFinite()检查一个值是否为有限的 返回false则Infinity

• Number.isNaN()检查一个值是否为NaN

• Number.isInteger()判断一个数值是否为整数

  • 25和25.0都是整数

• Number.EPSILON表示1与大于1的最小浮点数之间的差

• Math扩展

• BigInt数据类型

函数的扩展

1. 可以给函数参数指定默认值，如果形参没有被赋值触发事先设置的默认值

箭头函数

初读

• =>来定义函数

• var f = v => n==》var f = function(v){return n}

1. f 接收函数返回值的变量；

2. v 表达式的function()内的形参，在箭头函数不需要参数或者需要多个参数时，使用一个（）来代替v

3. n 函数的代码块部分，只有一句则代表返回值；

---

• 箭头函数的代码块多余一条语句时，使用{}将语句块包起来且使用return语句返回

• 如果返回值是一个对象，则需要用（）将结果包起来，不然{}会被解析为代码块，报错

箭头函数只有一行语句，且不需要返回值

let fn = () => void doesNotReturn();

箭头函数与变量解构结合使用

const full = ({ first, last }) => first + ' ' + last;
此处的这个{first,last}相当于是person对象
​
// 等同于
function full(person) {
  return person.first + ' ' + person.last;
}

简化回调函数

// 普通函数写法
[1,2,3].map(function (x) {
  return x * x;
});
​
// 箭头函数写法
[1,2,3].map(x => x * x); // x看做是function(x);x*x看做是{return x*x}

注意

• 箭头函数没有this对象

• 不能对箭头函数使用new命令，不能当做是构造函数，不然会抛出一个错误

• arguments对象在函数体内不存在，用rest参数代替

• 箭头函数中的this对象是固定的

• 我的理解：箭头函数的this 指向 普通函数this 指向的上一层

rest参数

用于获取函数的多余参数，形式为...变量名；

rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中

数组的扩展

1. 扩展运算符（spread）是三个点（...），将一个数组转为用逗号分隔的参数序列

2. Array.from()用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象

3. Array.of()方法用于将一组值，转换为数组。

4. 数组实例的copyWithin()方法，在当前数组内部，将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。也就是说，使用这个方法，会修改当前数组。

5. 数组实例的find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。

6. 数组实例的findIndex方法的用法与find方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。

   第5点和6点都可以接受第二个参数，用来绑定回调函数的this对象

7. Array.prototype.flat()用于将嵌套的数组“拉平”，变成一维的数组。该方法返回一个新数组，对原数据没有影响。

8. flatMap()方法对原数组的每个成员执行一个函数（相当于执行Array.prototype.map()），然后对返回值组成的数组执行flat()方法。该方法返回一个新数组，不改变原数组。

9. 数组的空位指的是，数组的某一个位置没有任何值，比如Array()构造函数返回的数组都是空位。

对象的扩展

1. 属性的简洁表示法：允许在大括号里面，直接写入变量和函数，作为对象的属性和方法

2. 属性名表达式：方法一是直接用标识符作为属性名，方法二是用表达式作为属性名，这时要将表达式放在方括号之内。

3. 属性的可枚举性和遍历：

   1. 属性的遍历

      ES6 一共有 5 种方法可以遍历对象的属性。

      （1）for...in

      for...in循环遍历对象自身的和继承的可枚举属性（不含 Symbol 属性）。

      （2）Object.keys(obj)

      Object.keys返回一个数组，包括对象自身的（不含继承的）所有可枚举属性（不含 Symbol 属性）的键名。

      （3）Object.getOwnPropertyNames(obj)

      Object.getOwnPropertyNames返回一个数组，包含对象自身的所有属性（不含 Symbol 属性，但是包括不可枚举属性）的键名。

      （4）Object.getOwnPropertySymbols(obj)

      Object.getOwnPropertySymbols返回一个数组，包含对象自身的所有 Symbol 属性的键名。

      （5）Reflect.ownKeys(obj)

      Reflect.ownKeys返回一个数组，包含对象自身的（不含继承的）所有键名，不管键名是 Symbol 或字符串，也不管是否可枚举。

运算符的扩展

1. 指数运算符

   n**mn的m次方，

   特殊：这个运算符是右结合

   // 相当于 2 ** (3 ** 2)
   2 ** 3 ** 2

2. 链判断运算符

3. Null判断运算符

4. 逻辑赋值运算符

Symbol

一种新的原始数据类型

1. 创建：通过Symbol函数生成

2. 凡是属性名是Symbol类型，就是独一无二的，可以保证不会与其他属性名产生冲突，即便这两个属性名都为Symbol

3. 可以接受一个字符串作为参数，表示对Symbol实例的描述，主要是为了区分

4. Symbol()可以作为属性名，可以有效地防止某个键被不小心改写或覆盖

Set数据结构

类似于数组，但是成员的值都是唯一的，没有重复的值

1. Set本身是一个构造函数，用来生成Set数据结构

2. 添加成员：add()

3. Set函数可以接受一个数组作为参数，用来初始化，会把数组中重复的成员去掉

4. 并且数据加入到Set数据结构中后，数据的类型不会改变

5. 属性：构造函数，size返回Set实例中的成员总数

6. 方法：

   • Set.prototype.add(value)：添加某个值，返回 Set 结构本身。

   • Set.prototype.delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。

   • Set.prototype.has(value)：返回一个布尔值，表示该值是否为Set的成员。

   • Set.prototype.clear()：清除所有成员，没有返回值。

7. 遍历Set：

   • Set.prototype.keys()：返回键名的遍历器

   • Set.prototype.values()：返回键值的遍历器

   • Set.prototype.entries()：返回键值对的遍历器

   • Set.prototype.forEach()：使用回调函数遍历每个成员

文章还在持续更新中…

声明：谨代表个人观点，各位看官开心就好~