我总结的都是一些基础的知识点，我们可以通过阮一峰的网站上有更具体的知识点和语法，这是阮一峰写的es6的网站 --- https://www.bookstack.cn/read/es6-3rd/sidebar.md

在es6中常遇到的问题：

1.es5和es6继承的区别：

ES5的继承是通过原型或构造函数机制实现的；它先创建子类，再实例化父类并添加到子类this中。 ES6先创建父类，再实例化子集中通过调用super方法访问父级后，再通过修改this实现继承。

2.、ES6的模板字符串有哪些新特性？并实现一个类模板字符串的功能

基本的字符串格式化。
将表达式嵌入字符串中进行拼接。
用${}来界定在ES5时我们通过反斜杠()来做多行字符串或者字符串一行行拼接。
ES6反引号(``)就能解决类模板字符串的功能

3.介绍下 Set、Map的区别？

应用场景Set用于数据重组，Map用于数据储存Set：　
（1）成员不能重复
（2）只有键值没有键名，类似数组
（3）可以遍历，方法有add, delete,has
Map:
（1）本质上是健值对的集合，类似集合
（2）可以遍历，可以跟各种数据格式转换

4.Promise 中reject 和 catch 处理上有什么区别

reject 是用来抛出异常，catch 是用来处理异常
reject 是 Promise 的方法，而 catch 是 Promise 实例的方法
reject后的东西，一定会进入then中的第二个回调，如果then中没有写第二个回调，则进入catch
网络异常（比如断网），会直接进入catch而不会进入then的第二个回调

5.说一下你对promise的理解？

promise有三种状态:pending/reslove/reject 。pending就是未决,resolve可以理解为成功,reject可以理解为拒绝
promise构造函数是同步执行的，then方法是异步执行的

可以用 promise.then()，promise.catch() 和 promise.finally()这些方法将进一步的操作与一个变为已敲定状态的 promise 关联起来，.then返回的数据永远是promis可一直.then。

6.asyn和awit函数

async async是一个加在函数前的修饰符，被async定义的函数会默认返回一个Promise对象resolve的值。因此对async函数可以直接then，返回值就是then方法传入的函数。 await await 也是一个修饰符，只能放在async定义的函数内。可以理解为等待。 await 修饰的如果是Promise对象：可以获取Promise中返回的内容（resolve或reject的参数），且取到值后语句才会往下执行；如果不是Promise对象：把这个非promise的东西当做await表达式的结果。

7.es6中async/awit和.then的区别

async/await实际是建立在promise之上的。因此不能把它和回调函数搭配使用。

async/await可以使异步代码在形式上更接近于同步代码。这是它最大的价值。

async是让请求接口的顺序按自己想要的顺序执行。一个等一个。

基础知识点:

一.let，const，var的区别

let
用来声明变量的，不可以重复声明，可以重复的赋值
const
是用来声明常量的，常量称为只读数据。
一旦声明必须赋值，且不可再改，使用const声明的常量不可以重复声明更不可以重复赋值
var
用来声明变量的，可以重复的赋值，可以重复的声明
a.相同点
都是声明的关键字

b.不同点

(1).变量提升只有 var
(2).作用域： var 声明的变量存在于 window 顶级对象中，let和const的变量存在于独立的块级作用域中
(3).let可以重新赋值，const不可以重新赋值

二.es6的经典题：暂时性死区？

let和const的块级作用域的特性。
当let 或 const放在{}里的时候，这个{}就会变成块级作用域，被let 或const声明的变量锁死 --- 暂时性死区
在er5 时代，作用域只有全局的 window 和局部的作用域，受条件限制，for 循环，it 和 switch 里的变量汇污染全局，现在有了let 和const之后，凡是有{}的在吗块里面使用了let或const则{}机会变成块级作用域-----------暂时性死区===块级作用域

三.三者的使用场景（let，const，var）

1.let适合在for循环中的定时器使用，作为强类型语法限制的变量

2.const适合作为一次性赋值的常量，多用于数据版本号或id

3.var适合兼容老的ie浏览器，对于很旧的项目使用的比较多，目前推荐使用let代替

四.模板字符串/超级字符串

1.可以换行，并且原格式输出，自动添加制表符
2.可以使用‘${}’的形式插入表达式或变量值

五.es6里的解构赋值

a.对象
1.使用{}去解构，不光解构自身的属性，还会解构原型上的属性
2.对于对象自身没有找到的属性，解构除了的变量的值是undefined

b.数组
1.使用【】去解构，按顺序解构
2.对于不存在的，得到的值也是undefined

六.解构赋值中的对象和数组的区别是？

1.对象解构按属性名解构
2.数据解构按位置解构

七.解构赋值中的默认值
·var [2=1]=[1]·如果目标数据中么有对应的项，则使用默认值

八.function（普通函数）和箭头函数

相同点
1.都是函数
2.都有局部作用域
不同点
1.语法不同
2.this指向不同
1.function指向调用它的对象
2.箭头指向上一层作用域里的对象
3.不定参伪数组
1.function 函数中有arguments
2.箭头函数没有arguments，但是可以使用...扩展运算符得到类似的形参集合
4.箭头函数不可以作为构造函数使用，不可以使用new调用
5.箭头函数没有原型对象
6.箭头函数只能是匿名函数
7.箭头函数不能改变this指向

九.函数重载

一个函数根据传入的不同的参数，执行不同的业务，实现不同的效果，这就叫函数重载

十.函数尾部调用

一个函数返回的是另一个函数的返回值，
目的是两个：数据的传递和加工，为了节省内存的开关释放

十一.函数的链式调用

列子：`$(#box).css('color'.'red').hide().show()`
核心概念：每一个被调用的函数都会返回一个值，链式调用中的返回值一般都是操作的目标元素的this

十二.es6新增的方法

es6新增方法

数组的
实例上的方法
1.map 遍历数组并返回一个新的数组
2.filter 过滤数组，从数组中过滤出需要的值，返回一个新的值
3.fill 填充，如果数组中有空的值，则可以使用它来填充值
4.reduce 累计计算，执行顺序从左到右
接受两个参数，第一个参数表示上一次的返回值，如果是第一次遍历，第一个参数使用的数组的第一个值，如果我们给了默认值的话则会使用默认值
最后它会返回一个累计的值
多用于购物车的总价格结算
5.reduceRight 累计计算，执行顺序从右到左
6.find 查找符合项，找到后返回当前项，找不到返回undefined,只返回找到的第一个
7.includes 匹配是否包含，如果有返回true,没有返回false
8.findindex 查找包含项的下标，找回返回下标，找不到返回-1，只返回找到的第一个
原型方法
9.isArray(value) 检测值是不是数组
10.flat 降维：把多维数组降维，传入一个维度数字即可
11.form 转成数组【伪数组、对象、set和map】
12.of 数组转换，将序列转为数组
13.entries() 把数组的下标和值结构成新的数组，这个三个方法都是把数组变成可迭代的可枚举对象使用，返回值使用next方法调用
14.keys() 把数组的下标解构成数组
15.values() 把数组的值结构成数组

对象的
1.entries 把对象的键值转成数组
2.keys 把对象的转成数组
3.values 吧对象的值转换成数组
4.is 判断两个对象是不是同一个引用，返回值是布尔值
5.assign 合并对象，将多个对象合并为一个，返回一个新对象，会修改目标对象

es6字符串方法

includes 查找包含，返回布尔
startsWith 匹配字符串第一个字母是否包含
endsWith 匹配字符串最后一个字母是否包含
repeat 复制字符串n次一般浏览器支持最大重复次数在1000万
trimStart 去除头部空格
trimEnd 去除尾部空格
padStart 在头部填充，第2个参数是用来被填充的内容，第1个参数是目标字符串的指定长度
padEnd 在尾部填充
matchAll 返回正则匹配出来的所有内容，是一个迭代器

----------------------------es5里的字符串方法

trim 去除掉字符串首尾空格

数字

1_000_000_000_000_000_00 对于较长的数字使用下划线分割
四舍五入 round
随机数 random 默认0-9随机数
向上取整 ceil
向下取整 floor
转整数 parseInt
转小数 parseFloat
取小数位 toFixed

map 和 set 数据类型

set 只能对储基本数据类型的值保证必须是唯一的，有去重的功能，如果是引用数据类型则不会去重。

set类型转数组

Array.from
[...setData]

自带方法

get 获取
add 添加
delete 删除
clear 清空
has 查询
values 序列化值
forEach 遍历

使用场景最多的时候

数组去重

map

语法：new Map([['key',value],[key, value]])
自带方法和set一样

Symbol 唯一的数据类型，即便使用它初始值相同，返回的值也是不同的

proxy 代理方法，它可以监听一切数据类型的值

reflect 代理方法，比proxy要弱一点

promise 异步解决方法

目的是把异步操作变成了同步执行
解决了回调地狱

特点

如果接口请求成功调用resolve，否则调用reject
状态一旦使用，则不能修改
promise一旦执行不能终止

同源策略

http://baidu.com:8080

http:// 协议
baidu.com 域名
8080 http 80默认端口,https 443默认端口

协议、域名、端口必须一致叫同源,有一个不一致叫跨域
同源策略是一种保护机制,保证网站内容不容易被轻易窃取

module 模块化语法

es6使用import 导入模块
es6使用export 导出模块
解释:模块化就是让每一个js文件作为独立的模块使用,它拥有自己的独立的作用域,不回污染全局环境.
在原生的html中的script标签上使用type=‘module’即可以使当前script标签变成模块化.

使用方法

每个模块只能有一个export default 叫默认导出模块,上游导入的时候,直接使用变量名接收.

// 导出
export default {}
// 导入
import name from "./moduleName"

可以使用export直接导出功能,一个模块可以无限次使用export直接导出,上游导入的时候需要使用解构的方式获取

// 导出
export let name = '123'
export const obj = {}
export let arr = []

// 导入
import { name, obj, arr } from "./moduleName"

别名设置

如果导入的模块名称和当前作用域的变量名有冲突,我们可以给导入的模块取一个别名,避免这种命名冲突问题

as import name as newName from "./xx" or import { name as newName } from "./xxx"

async和await 是promise的语法糖

定义:用于函数,把异步函数变成了同步执行,比promise更加的直观.

综合

同源策略
1.同源策略：当发起一个http请求的时候，我们当前的网址和被请求的网址=>
协议、域名、端口必须保持一致，如果有一个不同就产生了非同源策略，也就是跨域了
2.同源策略的目的就是为了保护站点资源的安全性
3.同源策略只有浏览器有，其他的软件，系统没有的。

如果产生了非同源策略【跨域】，如何解决
1.jsonp
原理：创建一个script标签，使用他的src属性请求，因为这个标签不受浏览器同源策略的限制，所以可以跨域请求
其他的：
1.img
2.link
3.iframe
2.借助后端语言完成请求代理
java
php
nodejs
3.Vue项目中使用vue.config.js里配置跨域
vue.config.js是Vue脚手架的配置文件
vue@cli 创建Vue项目
Vue脚手架底层是基于webpack封装的
webpack不是给浏览器用的，必须使用nodejs来执行
nodejs是吧浏览器的内核抽离出来，安装到了电脑的全局环境中，让任何位置都可以允许js文件。nodejs是后端语言
代理请求的过程：Vue.config.js=>webpack=nodejs[后端程序代理请求]
4.cors跨域
后端做了请求的白名单处理
只要前端的流量器支持cors跨域就可以

封装自己的axios

axios
目前是最火的前端请求库-工具，他是基于ajax和promise封装的，他强大的地方在与可以运行在浏览器端，也可以运行在nodeJs端
安装使用和封装
安装：npm i axios

axios上传文件

截流和防抖
目的：性能优化
实现：闭包

截流
固定的时间内必须执行一次

一个程序事件在持续的触发当中，我们使用截流保证在固定的时间段内执行一次

防抖
永远保持执行最后一次
事件如果持续触发，防抖就一直等待，等到事件触发完毕后才会执行最后一次
场景：搜索框

es6的知识点