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,都是返回一个迭代的类数组对象,这两个值是一样的
2. Map
  • 存储键值对的集合,且键不可重复
2.1 Map 的方法
  • keys,返回键的类数组对象
  • values,返回值的类数组对象
  • keys 与 values:set,map 使用 set 方法来添加或者修改数据
    其他方法与 set 类似

四、localStorage、sessionStorage、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');

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

js 复制代码
const myObject = {
  [Symbol('myKey')]: 'myValue',
};

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

七、async/await

  • 用同步的方式,执行异步操作
  • await 只能在 async 中使用(ES2021 中已经支持顶层 await)
  • await 的返回值是一个 Promise 对象
  • 注意多个 await 执行时,一个 await 报错,后续的 await 都不会执行
  • 可以使用 try catch 包裹报错的 await
  • 更加优雅的处理了 Promise.then 的链式调用
相关推荐
嘟嘟同学和妮妮同学1 小时前
【升级】一个中国历史可视化站:皇帝时间线梳理、古代思想流派、诗词鉴赏 (2)
前端·html
暗夜行者之光2 小时前
LangGraph + MCP 实战:构建"自然语言查数据"的 ChatBI Agent
前端·后端
一tiao咸鱼2 小时前
还在手动海投?我做了个 AI 求职助手,自动筛选 BOSS 职位再精准投递
前端·后端·面试
尤水就下2 小时前
🔥预热:在线文档的 block 架构是如何实现的(未完待续...)
前端·javascript·架构
全栈项目管理程序猿2 小时前
ArcGIS JS 基础教程(29):CSVLayer 表格点位图层
前端·javascript
骑着蜗牛撵大象3273 小时前
豆包 Seed 驱动的记账智能体:从拍票抽取到月报生成的全链路落地记录
java·前端·javascript·结构化输出·豆包seed·多模态识别·记账系统
溪语流沙3 小时前
【Web全栈进阶】前端世界观:现代工具链与框架为什么存在
前端·javascript·vue.js
kyriewen3 小时前
我逐个测了 JSON.stringify 的 7 个坑:第 1 个就在丢数据
前端·javascript·程序员
积流成海4 小时前
用代码实现哈希计算器:Web Crypto API 实战
前端·算法·哈希算法·哈希函数·盘子工具站
data analyse 4564 小时前
服务端访问日志聚合 PV 与 UV 怎么实现?日志采集与口径设计
大数据·前端·数据分析