es6易考点

深藏阁楼爱情的钟 2022-05-06 06:42 193阅读 0赞

### 1.es6是什么，对此的理解是什么 ###

答：ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。

es6就是es5的升级版，es5是js的通用标准，绝大多数浏览器都支持其语法，但是es6则不同，如果es6的代码需要在浏览器上运行，那就先将es6转换为es5。如果在es6中使用模块化机制，需要将个模块合并为总模块再来使用。

### 2.es6声明变量的写法，及之间的区别 ###

保留了var和function。新增加了let、const、class和import。  
   而且,let、const、class声明的全局变量再也不会和全局对象的属性挂钩了

**  let特点** :1) 不能重复声明  
                2) 不存在变量声明的提升  
               3) let 存在块级作用域

for(let j = 0; j < 10; j++) {}
      console.log(j);// Error: j is not define

4) 暂时性死区。  
                      在代码块内，使用let命令声明变量之前，该变量都是不可用的。

**const特点：**1）大部分与let差不多

2）只能初始化一次,必须显示初始化（只读型）（一旦声明，必须初始化）

**class：1）**class作为es6构造函数的语法糖

(1)、方法之间不需要逗号分隔 (2)、toString () \{\} 等价于 toString: function () \{\} (3)、你仍然可以使用Point.prototype (4)、你可以用Object.assign()一次性扩展很多方法 (5)、类内部定义方法多是不可以枚举的 (6)、constructor()\{\}是一个默认方法，如果没有添加，会自动添加一个空的。//构造函数放属性的，this.age (7)、constructor默认返回实例对象（this），完全可以指定返回其他的对象。 (8)、必须用new调用 (9)、不存在变量提升 (10)、当用一个变量去接受class时，可以省略classname  
  (11)、es6不提供私有方法。

2）使用extends继承

(1)、constructor中必须调用super,因为子类中没有this,必须从父类中继承。 (2)、子类的\_\_proto\_\_属性总是指向父类 (3)、子类的prototype属性的\_\_proto\_\_总是指向父类的prototype (4)、Object.getPrototypeOf()获取父类 (5)、super作为方法只能在constructor中 (6)、super作为属性指向父类的prototype. (7)、在constructor中使用super.x = 2，实际上this.x = 2;但是读取super.x时，又变成了父类.prototype.x。 (8)、原生构造函数是无法继承的。 (9)、get set 方法可以对属性的赋值和读取进行拦截 (10)、静态方法不能被实例继承。通过static声明 (11)、静态属性只能 ThreeDPoint.name = "123" 声明 （与static没什么关系）

** import ：**

1、ES6引入了自己的模块系统。通过export导出，import导入。

2、与CommonJS不同的是，它是获取模块的引用，到用的时候才会真正的去取值。

3、例如student.js中:

let student = \[ \{ name: 'xiaoming', age: 21, \}, \{ name: 'xiaohong', age: 18 \} \] export default student; // 这种导出方式，你可以在import时指定它的名称。

4、在app.js中我们就可以这样用: import StudentList from './student.js'; //指定名称 console.log(StudentList\[0\].name); //xiaoming

### 3. 为什么要用ES6？？？ ###

1. 具有模块化机制  
       2. 简洁的语法  
       3. 高效函数

### 4.解构的用法、好处，用途 ###

**  用法：**1）数组解构

let [a, b, c] = [1, 2, 3];
    let [foo = true] = [];

2）对象解构

3）字符串解构

let \[a,b,c,...d\] = "hello"//'h','e','l','lo'

4）函数解构

**好处/用途：** 在一个表达式中为多个变量赋值

1）交换两个变量的值

2）从函数返回多个值

3）函数参数的定义

4）提取json数据

let jsonData = {
        id: 42,
        status: 'OK',
        data: [867, 5309]
    };
    let { id, status, data: number } = jsonData;

5）函数参数的默认值

6）遍历Map结构

7）输入模块的指定方法

const { SourceConsumer, sourceNode } = require('source-map');

###  5.es6   set和map集合 ###

#   Set #

一个`Set`是一群值的集合。它是可变的，能够增删元素。现在，还没说到它和数组的区别，不过它们的区别就和相似点一样多。

首先，和数组不同，一个`Set`不会包含相同元素。试图再次加入一个已有元素不会产生任何效果。

这个例子里元素都是字符串，不过`Set`是可以包含JS中任何类型的值的。同样，重复加入已有元素不会产生效果。

其次，`Set`的数据存储结构专门为一种操作作了速度优化：包含性检测。

以下是`Set`支持的所有操作：

*  `new Set`：创建一个新的、空的`Set`。
 *  `new Set(iterable)`：从任何[可遍历数据][Link 1]中提取元素，构造出一个新的集合。
 *  `set.size`：获取集合的大小，即其中元素的个数。
 *  `set.has(value)`：判定集合中是否含有指定元素，返回一个布尔值。
 *  `set.add(value)`：添加元素。如果与已有重复，则不产生效果。
 *  `set.delete(value)`：删除元素。如果并不存在，则不产生效果。`.add()`和`.delete()`都会返回集合自身，所以我们可以用链式语法。
 *  `set[Symbol.iterator]()`：返回一个新的遍历整个集合的迭代器。一般这个方法不会被直接调用，因为实际上就是它使集合能够被遍历，也就是说，我们可以直接写`for (v of set) {...}`等等。
 *  `set.forEach(f)`：直接用代码来解释好了，它就像是`for (let value of set) { f(value, value, set); }`的简写，类似于数组的`.forEach()`方法。
 *  `set.clear()`：清空集合。
 *  `set.keys()`、`set.values()`和`set.entries()`返回各种迭代器，它们是为了兼容`Map`而提供的，所以我们待会儿再来看。

在这些特性中，负责构造集合的`new Set(iterable)`是唯一一个在整个数据结构层面上操作的。你可以用它把数组转化为集合，在一行代码内去重；也可以传递一个生成器，函数会逐个遍历它，并把生成的值收录为一个集合；也可以用来复制一个已有的集合。

*  目前数组已经有的一些辅助函数，比如`.map()`、`.filter()`、`.some()`和`.every()`。
 *  不改变原值的交并操作，比如`set1.union(set2)`和`set1.intersection(set2)`。
 *  批量操作，如`set.addAll(iterable)`、`set.removeAll(iterable)`和`set.hasAll(iterable)`。

set的应用  
            如何将数组转换为set集合  
                let arr = \[\];  
                let set = new Set(arr);  
            如何将set集合转换为数组  
                Array.from(set);  
                或  
                \[...set\]  
            为什么要用set  
                1) 不能存储重复的值  
                2) api  
             因此使用 Set 可以很容易地实现并集（Union）、交集（Intersect）和差集  
                let a = new Set(\[1, 2, 3\]);  
                let b = new Set(\[4, 3, 2\]);

// 并集  
                let union = new Set(\[...a, ...b\]);  
                // Set \{1, 2, 3, 4\}

// 交集  
                let intersect = new Set(\[...a\].filter(x => b.has(x)));  
                // set \{2, 3\}

// 差集  
                let difference = new Set(\[...a\].filter(x => !b.has(x)));  
                // Set \{1\}

# Map #

一个`Map`对象由若干键值对组成，支持：

### 6.es6中promise机制   ###

*  `new Map`：返回一个新的、空的`Map`。
 *  `new Map(pairs)`：根据所含元素形如`[key, value]`的数组`pairs`来创建一个新的`Map`。这里提供的`pairs`可以是一个已有的`Map` 对象，可以是一个由二元数组组成的数组，也可以是逐个生成二元数组的一个生成器，等等。
 *  `map.size`：返回`Map`中项目的个数。
 *  `map.has(key)`：测试一个键名是否存在，类似`key in obj`。
 *  `map.get(key)`：返回一个键名对应的值，若键名不存在则返回`undefined`，类似`obj[key]`。
 *  `map.set(key, value)`：添加一对新的键值对，如果键名已存在就覆盖。
 *  `map.delete(key)`：按键名删除一项，类似`delete obj[key]`。
 *  `map.clear()`：清空`Map`。
 *  `map[Symbol.iterator]()`：返回遍历所有项的迭代器，每项用一个键和值组成的二元数组表示。
 *  `map.forEach(f)` 类似`for (let [key, value] of map) { f(value, key, map); }`。这里诡异的参数顺序，和`Set`中一样，是对应着`Array.prototype.forEach()`。
 *  `map.keys()`：返回遍历所有键的迭代器。
 *  `map.values()`：返回遍历所有值的迭代器。
 *  `map.entries()`：返回遍历所有项的迭代器，就像`map[Symbol.iterator]()`。实际上，它们就是同一个方法，不同名字。

**什么叫promise？**

Promise对象可以理解为一次执行的异步操作，使用promise对象之后可以使用一种链式调用的方式来组织代码；让代码更加的直观。

作用：在ajax请求数据的过程中，我们可以异步拿到我们想要的数据，然后在回调中做相应的数据处理。

promise机制分为两种  
     承诺的定义  new  Promise()+回调函数(参数：resolve，reject)  
     承诺的监听  ：catch  then(承诺resolve执行时)

p.then((data)=>\{  
            console.log(data);  
        \}).catch((error)=>\{  
            console.log(error);  
        \}).finally(()=>\{  
            //始终要执行的代码  
        \});

[Link 1]: https://hacks.mozilla.org/2015/04/es6-in-depth-iterators-and-the-for-of-loop/