学习前端面试知识（10）

2024-8-10  打卡第十天  学习视频链接

es5和es6的区别大概介绍

• es5没有块级作用域，es6出现了块级作用域let和const
  • es5的var有变量提升（对于使用 var 声明的变量，JavaScript 会将其声明部分提升到所在作用域的最开始，但变量的初始化（即赋值）仍然保留在原位置。这意味着你可以在声明变量之前访问该变量）。
  • 两个块级变量与 var 不同，let 和 const 声明的是块级作用域（block scope）的变量，它们也被“提升”，但这种提升的行为与 var 有所不同。let 和 const 的声明会被提升到所在作用域的开始，但有一个重要的区别：在它们被实际声明之前的区域，这些变量是处于“暂时性死区”（Temporal Dead Zone, TDZ）的。这意味着在它们被声明之前的任何尝试去访问或修改这些变量的行为都会抛出 ReferenceError
• es6出现了箭头函数的概念 (() => {})
• 模版字符串，允许换行

<script>
    let name = 'John';
    let gretting = `Hello ${name}!`;
    console.log(gretting);
</script>

• es6解构赋值 从数组或者对象中解构进行赋值，边提取边赋值...arr
• es6中for of循环 遍历数组，set，map
• import export 导入导出的标准
• es6中set 数据结构，所有数据唯一没有重复值
• ... 展开运算符
• 修饰器 @decorator 编译执行的函数
• es6中可以使用class类，不需要像es5一样原型链形成
• async await promise
• promise 异步编程解决方案
• Symbol es6新增的基础类型，返回唯一值
• Proxy 代理对象（vue3中使用）

var,let,const区别

• var可以重复声明，let不能重复声明
• var不受限于块级，let和cosnt都是块元素
• var会跟window相映射
• var可以在声明的上方访问变量,let和const都是暂存性死区，声明前调用会报错
• const声明后必须赋值，表示设置为常量，不能修改

使用箭头函数应该注意什么

• () => {} 
  • this不再指向window，而是指向父级，指向可变
  • 不能使用arguments
  • 不能使用构造函数，即不能使用new创建相关实例不然会抛出异常
  • 不能使用yield命令，不能用做generator函数

set和map的区别

set相关

• set一般用于数组
• 成员不能重复
• 只有键值没有键名类似数组
• 可以遍历 add delete has
• 常见操作：数组去重

map相关

• 本质上是一个键值对的集合，类似集合
• 可以遍历，跟各种数据格式转换
• 常见操作：存储数据类型的结构

Promise有几种状态

• 初始状态 pending
• 成功 fulfilled
• 失败 reject
• 状态不可逆，从pending-fulfilled表示成功的触发或者pending-reject表示失败，会触发catch
• 下列代码输出顺序为1243

<script>
    const promise = new Promise((resolve,reject) => {
        console.log(1);
        resolve();
        console.log(2);
    })
    promise.then(() => {
        console.log(3);
    })
    console.log(4);
</script>