ES Module
优点
静态分析
浏览器和 Node 都支持
浏览器的新 API 能用模块格式提供
不再需要对象作为命名空间export
用于规定模块的对外接口
输出的接口与其对应的值是动态绑定关系
可以取到模块内部实时的值import
用于输入其他模块提供的功能
具有提升效果，会提升到整个模块的头部，首先执行
静态执行不能使用表达式和变量
多次重复执行同一句 import 语句只会执行一次import()
支持动态加载模块
适用场合
按需加载
条件加载
动态的模块路径ES6 模块与 CommonJS 模块
CommonJS 模块输出的是一个值的拷贝
ES6 模块输出的是值的引用
CommonJS 模块是运行时加载
ES6 模块是编译时输出接口
CommonJS 加载的是一个对象该对象只有在脚本运行完才会生成；ES6 模块不是对象，它的对外接口只是一种静态定义，在代码静态解析阶段就会生成
CommonJS 模块的 require() 是同步加载模块 ES6 模块的import命令是异步加载，有一个独立的模块依赖的解析阶段
加载
CommonJS 的 require() 命令不能加载 ES6 模块，只能使用 import() 这个方法加载
ES6 模块的import命令可以加载 CommonJS 模块，但是只能整体加载，不能只加载单一的输出项Class 类
本质
一个语法糖，实质依然是函数
只是让对象原型的写法更加清晰、更像面向对象编程的语法静态方法
static 关键字
该方法不会被实例继承，直接通过类来调用
静态方法中的 this 指向类本身，而不是实例静态属性
Class 本身的属性私有方法和私有属性
只能在类的内部访问的方法和属性new.target 属性
用在构造函数之中，返回 new 命令作用于那个构造函数
可以用来确定构造函数是怎么调用的
Class 内部调用 new.target，返回当前 Class
子类继承父类时，new.target 会返回子类
在函数外部，使用 new.target 会报错继承
通过 extends 关键字实现继承，让子类继承父类的属性和方法
限制
子类必须在 constructor() 方法中调用 super()
不调用 super() 方法子类就得不到自己的 this 对象Object.getPrototypeOf()
用来从子类上获取父类super 关键字
作为函数调用时，代表父类的构造函数
作为函数时只能用在子类的构造函数之中
作为对象时
在普通方法中指向父类的原型对象
在静态方法中指向父类类的 prototype 属性和 __proto__ 属性
子类的 __proto__ 属性，表示构造函数的继承，总是指向父类
子类prototype属性的__proto__属性，表示方法的继承，总是指向父类的prototype属性实例的 __proto__ 属性
指向父类实例的__proto__属性
子类的原型的原型，是父类的原型Promise
是异步编程的一种解决方案
特点
对象的状态不受外界影响
三种状态
pending（进行中）
fulfilled（已成功）
rejected（已失败）
状态不可逆：一旦状态改变，就不会再变
从 pending 变为 fulfilled
从 pending 变为 rejected
链式调用缺点
无法取消
一旦新建它就会立即执行，无法中途取消
如果不设置回调函数，Promise 内部抛出的错误，不会反应到外部
当处于 pending 状态时，无法得知目前进展到哪一个阶段实例方法
Promise.prototype.then()
用于实例添加状态改变时的回调函数（可选）会返回的是一个新的 Promise 实例
第一个参数是resolved状态的回调函数
第二个参数是rejected状态的回调函数
Promise.prototype.catch()
用于指定发生错误时的回调函数
Promise.prototype.finally() （ES2018）
用于指定不管 Promise 对象最后状态如何都会执行的操作
本质上是 then 方法的特例静态方法
Promise.resolve()
将现有对象转为 Promise 对象
参数是一个 Promise 实例
直接返回该实例
参数是一个thenable对象（具有 then 方法的对象）
转为 Promise 对象立即执行 thenable 对象的 then() 方法
参数不是具有 then() 方法的对象或根本就不是对象
原始值和不具有 then() 方法的对象
返回一个 resolved 状态的新 Promise 对象
不带有任何参数
返回一个 resolved 状态的新 Promise 对象
Promise.reject()
返回一个 rejected 状态的新 Promise 对象
Promise.all()
将多个 Promise 实例，包装成一个新的 Promise 实例，
只有所有的 Promise 状态成功才会成功，如果其中一个 Promise 的状态失败就会失败
Promise.race()
将多个 Promise 实例，包装成一个新的 Promise 实例，
新的 Promise 实例状态会根据最先更改状态的 Promise 而更改状态
Promise.allSettled()（ES2020）
将多个 Promise 实例，包装成一个新的 Promise 实例，
新的 Promise 实例只有等到所有这些参数实例都返回结果，
不管是 resolved 还是 rejected ，包装实例才会结束，
一旦结束，状态总是 resolved
Promise.any()（ES2021）
将多个 Promise 实例，包装成一个新的 Promise 实例，
只要参数实例有一个变成 resolved 状态，
包装实例就会变成 resolved 状态；
如果所有参数实例都变成 rejected 状态，包装实例就会变成 rejected 状态异步编程
Generator 函数
是 ES6 提供的一种异步编程解决方案
一个状态机，封装了多个内部状态
特征
function 关键字与函数名之间有一个星号
函数体内部使用 yield 表达式，定义不同的内部状态async 函数（ES2017）
特征
是 Generator 函数的语法糖
function 关键字前添加 async
函数体内部使用 await 表达式
对 Generator 函数的改进
内置执行器
更好的语义
更广的适用性
返回值是 Promise
使用注意点
把 await 命令放在 try...catch 代码块中
多个 await 命令后面的异步操作，如果不存在继发关系，最好同时触发。
await 命令只能用在 async 函数之中对象
简洁表示法
引用变量时可以简写
方法省略 function 关键字
简写的对象方法不能用作构造函数属性名表达式
obj['a' + 'bc'] = 123属性的遍历
for...in
遍历对象自身的和继承的可枚举属性，不含 Symbol 属性
Object.keys
返回一个数组，包括对象自身的（不含继承的）所有可枚举属性（不含 Symbol 属性）的键名
Object.getOwnPropertyNames
返回一个数组，包含对象自身的所有属性（不含 Symbol 属性，但是包括不可枚举属性）的键名
Object.getOwnPropertySymbols
返回一个数组，包含对象自身的所有 Symbol 属性的键名
Reflect.ownKeys
返回一个数组，包含对象自身的（不含继承的）所有键名，不管键名是 Symbol 或字符串，也不管是否可枚举
首先遍历所有数值键，按数值升序排列其次遍历所有字符串键，按加入时间升序排列最后遍历所有 Symbol 键，按加入时间升序排列super 关键字
指向当前对象的原型对象，只能用在对象的方法之中使用扩展运算符
取出参数对象的所有可遍历属性
等同于 Object.assign 方法Object.is
比较两个值是否相等
和全等运算符基本一致
只有 +0 不等于 -0 和 NaN 等于自身处理不同Object.assign
用于对象的合并将源对象的所有可枚举属性复制到目标对象
参数处理
只有一个参数时直接返回该参数
参数不是对象会先转成对象然后返回
第一个参数为 undefined 和 null 时会报错
注意点
浅拷贝
同名属性会被替换
处理数组时会把数组视为对象
只能进行值的复制如果复制的值是一个取值函数，会求值后再复制
用途
为对象添加属性
为对象添加方法
克隆对象
合并多个对象
为属性指定默认值Object.getOwnPropertyDescriptors
返回指定对象所有自身属性（非继承属性）的描述对象Object.getPrototypeOf
用来获取一个对象的原型对象Object.setPrototypeOf
用来设置一个对象的原型对象并返回参数对象遍历
Object.keys
获取参数对象自身的所有可遍历属性的键名
Object.values
获取参数对象自身的所有可遍历属性的键值
Object.entries
获取参数对象自身的所有可遍历属性的键值对数组
都不含继承的属性都会过滤属性名为 Symbol 值的属性Object.fromEntries
是 Object.entries 的逆操作将一个键值对数组转为对象Iterator
是一种接口，为各种不同的数据结构提供统一的访问机制
作用
为各种不同的数据结构提供统一的访问机制
使数据结构的成员能够按某种次序排列
供 for...of 循环消费遍历过程
创建一个指针对象，指向当前数据结构的起始位置
第一次调用指针对象的 next 方法，指针指向数据结构的第一个成员
第二次调用指针对象的 next 方法，指针指向数据结构的第二个成员
不断调用指针对象的next方法，直到它指向数据结构的结束位置next 方法
返回一个对象
value 属性返回当前位置的成员
done 属性是一个布尔值，表示遍历是否结束原生具备 Iterator 接口的数据结构
Array
Map
Set
String
TypedArray
函数的 arguments 对象
NodeList 对象对象没有 Iterator 接口
因为对象的哪个属性先遍历，哪个属性后遍历是不确定的，需要开发者手动指定for...of 循环
内部调用的是数据结构的 Symbol.iterator 方法
数组
扩展运算符
将一个数组转为用逗号分隔的参数序列Array.of
将一组值，转换为数组
弥补数组构造函数 Array 的不足Array.from
将两类对象转为真正的数组
类似数组的对象（array-like object）
DOM 操作返回的 NodeList
arguments
和可遍历（iterable）的对象
第二个参数类似数组的map方法
将字符串转为数组能正确处理各种 Unicode 字符copyWithin
在当前数组内部将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组查找
find
找出第一个符合条件的数组成员
未找到返回 undefined
findIndex
返回第一个符合条件的数组成员的位置
未找到返回 -1
includes
表示数组是否包含给定的值
返回布尔值fill
使用给定值填充一个数组遍历
keys
对键名的遍历
values
对键值的遍历
entries
对键值对的遍历
都返回一个遍历器对象可以用 for...of 循环flat
将嵌套的数组拍平 默认拍平一层flatMap
先对原数组的每个成员执行 map 再对返回值组成的数组执行 flat 方法
只能拍平一层数组at
返回参数对应位置的成员支持负索引 倒数的位置
超出范围返回 undefinedlet 和 const
相同点
不存在变量提升
暂时性死区 变量在声明之前都是不可用的
不允许重复声明
块级作用域 块级作用域之中的函数声明语句类似于 let，在块级作用域之外不可引用
let 可以修改
const 不可修改 基本类型保证值不可变等同于常量 引用类型保证内存指针不可变
Symbol
新的原始数据类型，表示独一无二的值
注意点
Symbol 函数前不能使用 new 命令
Symbol 函数的参数只是表示对当前 Symbol 值的描述，相同参数的 Symbol 函数的返回值是不相等的
Symbol 值不能与其他类型的值进行运算
Symbol 值可以显式转为字符串和布尔值
内置的 Symbol 值
Proxy 代理器
在目标对象之前架设一层拦截，外界对该对象的访问，都必须先通过这层拦截
实例方法
返回一个可取消的 Proxy 实例 Proxy.revocable()
在 Proxy 代理的情况下，目标对象内部的 this 会指向 Proxy 代理
this 问题 在 Proxy 代理的情况下，目标对象内部的 this 会指向 Proxy 代理
函数
参数支持默认值
rest 参数 获取函数的多余参数，只能在最后一个
length 属性 不包括设置了默认值的参数 不包括 rest 参数
name 属性 返回该函数的函数名
箭头函数
特点
没有自己的 this 对象 不能用 call apply bind
不可以当作构造函数 不能使用 new
不可以使用 arguments 对象 用 rest 参数代替
不可以用作 Generator 函数 不能使用 yield
应用 简化和封装回调函数
不适用场合
定义对象的方法且该方法内部需要 this
需要动态 this
允许函数最后一个参数有尾逗号
字符串
模板字符串
可以当作普通字符串使用
用来定义多行字符串 所有的空格和缩进都会被保留
可以在字符串中嵌入任意的 JavaScript 表达式函数等
支持嵌套
标签模板 函数的特殊调用形式
alert`hello` => alert(['hello'])新增方法
String 对象String.fromCodePoint从 Unicode 码点返回对应字符String.raw用于模板字符串的处理
String 实例
codePointAt 返回一个字符的码点 能够正确处理 4 个字节储存的字符 可测试一个字符由两个字节还是由四个字节组成
normalize Unicode 正规化，用来将字符的不同表示方法统一为同样的形式
查找字符
includes 表示是否找到了参数字符串
startsWith 表示参数字符串是否在原字符串的头部
endsWith 表示参数字符串是否在原字符串的尾部
repeat 返回一个将原字符串重复 n 次的新字符
padStart 头部补全
padEnd 尾部补全
replaceAll 一次性替换所有匹配 第二个参数支持特殊字符匹配
$&：匹配的字符串
$` ：匹配结果前面的文本
$'：匹配结果后面的文本
$n：匹配成功的第n组内容，n是从1开始的自然数（第一个参数必须是正则表达式）
$$：指代美元符号$at 返回参数指定位置的字符 支持负索引 倒数的位置 超出范围返回 undefined
Reflect
概述
从 Reflect 对象上可以拿到语言内部的方法
修改某些 Object 方法的返回结果，让其变得更合理
让 Object 操作都变成函数行为
静态方法
数值
二进制和八进制表示法
二进制用前缀 0b 或 0B 表示
八进制用前缀 0o 或 0O 表示
数值分隔符
使用下划线 _ 作为分隔符，没有指定间隔的位数
注意点
不能放在数值的最前面或最后面
不能同时两个或两个以上的分隔符
小数点的前后不能有分隔符
科学计数法里面表示指数的 e 或 E 前后不能使用Number 对象新增方法
Number.isFinite
检查一个数值是否有限的，即不是 Infinity
Number.isNaN
检查一个值是否为 NaN
Number.parseInt
解析一个字符串，并返回一个整数
Number.parseFloat
解析一个字符串，并返回一个浮点数
Number.isInteger
判断一个数值是否为整数
受 IEEE 754 标准限制超出 JS 安全数范围会误判都是从全局方法上移植过来的
只返回第一个数字
允许开头和结尾空格
第一个字符不能被转换为数字 时返回 NaN
Number.EPSILON
常量表示 1 与大于 1 的最小浮点数之间的差JavaScript 能够表示的最小精度
安全整数
Number.MAX_SAFE_INTEGER
表示在 JavaScript 中最大的安全整数2 的 53 次方 - 1
Number.MIN_SAFE_INTEGER
表示在 JavaScript 中最小的安全整数字-(2 的 53 次方 - 1)
Number.isSafeInteger
判断一个整数是否为安全整数Math 对象的扩展
BigInt 数据类型
表示整数，可以精确表示任何位数的整数
注意点
BigInt 函数必须有参数且参数必须可以转为数值，否则会报错
BigInt 不能与普通数值进行混合运算
BigInt 与其他类型可以使用比较和相等运算符新的数据结构Set 和 Map
Set
类似于数组成员的值都是唯一的
Set 函数可以接收一个数组用于初始化
实例属性
Set.prototype.size
返回 Set 实例的成员总数
实例方法
Set.prototype.add(value)
添加某个值返回 Set 实例本身
Set.prototype.delete(value)
删除某个值返回一个布尔值表示删除是否成功
Set.prototype.has(value)
返回一个布尔值表示该值是否为 Set 的成员
Set.prototype.clear()
清除所有成员没有返回值
遍历方法遍历顺序为插入顺序
Set.prototype.keys()
返回键名的遍历器
Set.prototype.values()
返回键值的遍历器
Set.prototype.entries()
返回键值对的遍历器
Set.prototype.forEach()
使用回调函数遍历每个成员
Set 结构没有键名，只有键值keys 方法和 values 方法的行为完全一致WeakSet
WeakSet 结构与 Set 类似都是不重复的值的集合
注意点
成员只能是对象不能是其他类型，否则会报错
WeakSet 中的对象都是弱引用 垃圾回收机制不考虑 WeakSet 对该对象的引用
WeakSet 不能遍历
实例方法
WeakSet.prototype.add(value)
WeakSet.prototype.delete(value)
WeakSet.prototype.has(value)WeakRef （ES2021） 创建对象的弱引用
Map
类似于对象是键值对的集合键的值可以是各种类型的值（包括对象）
Map 构造函数接收一个二维数组作为参数
实例属性
Map.prototype.size
返回 Map 结构的成员总数
实例方法
Map.prototype.set(key, value)
设置键名 key 对应的键值为 value 并返回 Map 实例
Map.prototype.get(key)
读取key对应的键值，找不到时返回 undefined
Map.prototype.has(key)
返回一个布尔值表示 key 是否在当前 Map 实例中
Map.prototype.delete(key)
删除某个 key 返回一个布尔值表示删除是否成功
Map.prototype.clear()
清除所有成员没有返回值
遍历方法 遍历顺序为插入顺序
Map.prototype.keys()
返回键名的遍历器
Map.prototype.values()
返回键值的遍历器
Map.prototype.entries()
返回所有成员的遍历器
Map.prototype.forEach()
遍历 Map 的所有成员WeakMap
WeakMap结构与Map结构类似都是键值对的集合
注意点
只接受对象作为键名（null 除外）
WeakMap 键名所指向的对象不计入垃圾回收机制
WeakMap 弱引用的只是键名，键值是正常引用
WeakMap 没有遍历操作
实例方法
WeakMap.prototype.set(key, value)
设置键名 key 对应的键值为 value 并返回 WeakMap 实例
WeakMap.prototype.get(key)
读取key对应的键值，找不到时返回 undefined
WeakMap.prototype.has(key)
返回一个布尔值表示 key 是否在当前 WeakMap 实例中
WeakMap.prototype.delete(key)
删除某个 key 返回一个布尔值表示删除是否成功运算符
指数运算符 ** （ES2016）
右结合 从最右边开始计算
链判断运算符 ?. （ES2020）
Null 判断运算符 ??（ES2020）
逻辑赋值运算符 （ES2021）
或赋值运算符 ||=
x ||= y 等同于 x || (x = y)
与赋值运算符 &&=
x &&= y 等同于 x && (x = y)
Null 赋值运算符 ??=
x ??= y 等同于 x ?? (x = y)
只有运算符左侧的值为 null 或 undefined 时 才会继续右侧的运算加群联系作者vx：xiaoda0423
仓库地址：https://github.com/webVueBlog/WebGuideInterview
