ES6+ 面试常问题

一、let const var 的区别

1. var:
  1. 没有块级作用域的概念,有函数作用域和全局作用域的概念
  2. 全局作用域性下创建变量会被挂在到 windows 上
  3. 存在变量提升
  4. 同一作用域下,可以重复赋值
  5. 创建未初始化,值为 undefined
2. let:
  1. 块级作用域
  2. 同一作用域性爱同一变量不允许重复声明
  3. 不存在变量提升
  4. 块级作用域下。在声明之前访问会有一个暂时性死区的专属报错
3. const:
  1. const 创建常量
  2. 创建的常量是指向的内存地址是不变的
  3. 若创建的是基本数据类型,则内存地址指向的就是数据,不可变
  4. 若创建的是引用类型数据,则内存地址中存放的是一个指针,指向一个对象
  5. 这里的指针在前端中被称为 ”引用“
  6. 这个对象属性是可以改变的

二、Promise 及其常用 API

1. Promise
1.1 then
  1. 一个有 then 方法的对象。有三种状态:
  2. 被 resolve 或者 resolve 之前处于 pending 状态。
  3. pending 可以用过 resolve 转换为 fulfilled 状态
  4. pending 也可以由 reject 转换为 rejected 状态
1.2 catch 方法
  • 捕获错误
1.3 finally 方法
  • then 方法或 catch 方法执行后执行
1.4 then 方法的链式调用
  1. 第一个 then 方法中回调函数的返回值,就是第二个 then 方法中形参的值

  2. 第二个 then 方法中 return 的返回值,会被后续的 then 方法使用

2. Promise.all
  • 可以同时请求多个接口,并且接口全部请求完毕后返回
2.1 Promise.allSettled
  1. 等待所有传入的 Promise 对象都完成,然后返回一个包含所有 Promise 对象状态的数组
  2. 在数组中使用 map,添加 catch,请求时,哪个报错就会返回 catch 中的值。
  3. 用来处理多个 Promise 对象,并根据它们的状态进行不同的处理
2.2 Promise.allSettled 方法与 Promise.all 方法的区别
  • Promise.allSettled 方法会返回一个包含所有 Promise 对象状态的数组
  • Promise.all 方法只会返回一个包含所有 Promise 对象结果的数组。
2.3 Promise.race
  • 该方法会等待所有传入的 Promise 对象中的第一个完成,然后返回该 Promise 对象的结果。
  • 如果所有 Promise 对象都被拒绝,则 Promise.race 方法会返回第一个被拒绝的 Promise 对象的错误。

三、Set 和 Map 对比

1. Set
  • 创建使用 new 来实例化,如 new Set()
1.1 set 方法
  • has,判断 set 中是否存在某条数据并返回 true/false
  • add,添加一条数据,到集合的末尾
  • clear,清空整个集合
  • forEach,循环遍历每一项,set 没有索引,所以第二个参数代表数据
  • size,集合数量
  • delete,删除某一项
  • keys & values,都是返回一个迭代的类数组对象,这两个值是一样的

ES6+ 面试常问题_第1张图片

2. Map
  • 存储键值对的集合,且键不可重复
2.1 Map 的方法
  • keys,返回键的类数组对象
  • values,返回值的类数组对象
  • keys 与 values:set,map 使用 set 方法来添加或者修改数据
    其他方法与 set 类似

ES6+ 面试常问题_第2张图片

四、localStorage、sessionStorage、cookie 的异同

1. cookie
  • 大小:4k
  • 通信:会参与到与服务端请求的通信中
  • 时效性:根据服务端设置的时间过期
  • tab 共享:同源窗口共享
2. localStorage
  • 大小:5m
  • 通信:单纯前端存储,不参与服务端通信
  • 时效性:持久化保存数据(关闭浏览器或者手动清除)
  • tab 共享:同源窗口支持共享
3. sessionStorage
  • 大小:5m
  • 通信:不支持
  • 时效性:页签级会话标签
  • tab 共享:不支持跨 tab 共享
4. sessionStorage 与 localStorage
  • 共同点:都保存在浏览器端,遵循 同源策略 。
  • 不同点:作用域不同

五、扩展运算符 …

1. 等号左边:
  • let [a, ...b] = [1, 3, 5]
    将剩余数据打包到一个新的数组中
2. 等号右边
  • 可以做解构
3. 形参
  • 将传递的参数打包到一个数组中

六、Symbol 数据结构

  • 原始数据类型 Symbol,表示独一无二的值

  • 用来定义对象的私有变量

  • 定义的私有对象是不可变的,并且不能被序列化
    const myPrivateVariable = Symbol('myPrivateVariable');

  • 也可以创建键名(作为唯一键名使用)

const myObject = {
  [Symbol('myKey')]: 'myValue',
};

总结:它可以用于创建私有变量、不可变对象和键名。

七、async/await

  • 用同步的方式,执行异步操作
  • await 只能在 async 中使用(ES2021 中已经支持顶层 await)
  • await 的返回值是一个 Promise 对象
  • 注意多个 await 执行时,一个 await 报错,后续的 await 都不会执行
  • 可以使用 try catch 包裹报错的 await
  • 更加优雅的处理了 Promise.then 的链式调用

你可能感兴趣的:(前端笔记,前端面试题,es6,前端,ecmascript)