var let const
// 代码1
console.log(num); // undefined
var num = 111;
//等同于
console.log(num); // 报错
let num = 111;// 或 const num = 111;
// 代码2
var num = 111;
var num = 222;
console.log(num); // 222
// 代码3
function func () {
for(var i = 0; i < 3; i++){
console.log(i) // 0 1 2
}
console.log(i) // 3
}
以上代码分别展示了var定义变量会出现的几个问题。
- 代码1: var会定义的变量会在执行时自动提升到顶层(声明提升),所以此时并没有报错。而是输出了
undefined,却没有赋值提升。代码等同于:
var num
console.log(num); // undefined
num = 111;
- 代码2:
var允许重新定义已有的变量名 - 代码3: 其实和代码1差不多,就是
var声明提升,导致for循环结束时,i变量依旧存在。因此引出了块级作用域的需要。
解决方案即为ES6的新语法let和const
let不存在声明提升、不允许在同一作用域声明已声明过的变量名、具有块级作用域且向下覆盖。其实也就是解决了以上的三个问题const和let一样,但const不允许修改,一般只用于定义常量。但存在一种场景为:当const声明的变量为Object类型时
const obj={}
obj.a='a'
const arr=[1,2,3]
arr.push(4)
console.log(obj.a) // a
console.log(arr.join('')) // 1234
不使用第三个变量的情况下,调换两个变量的值
const a = 1
const b = 2
[b, a]=[a, b]
考解构赋值的,比较简单。
数组去重方案
Set
const arr = [1, 2, 3, 4, 3, 2, 1]
const newArr = Array.from(new Set(arr))
// const newArr = [...new Set(arr)] 效果一样
Set自带去重效果,即塞入已存在元素时,会自动删除
Map
const arr = [1, 2, 3, 4, 3, 2, 1]
const map = new Map();
const newArr = new [];
for (let i = 0; i < arr.length; i++) {
if(map.has(arr[i])) {
// 记录重复项
map.set(arr[i], true);
} else {
map.set(arr[i], false);
newArr.push(arr[i]);
}
}
这里是运用了Map对象的特性,突破了传统Object的限制(只能用字符串做键名),可以用任何数据类型做键名。
includes
const arr = [1, 2, 3, 4, 3, 2, 1]
const newArr =[];
for(let i = 0; i < arr.length; i++) {
if(!newArr.includes(arr[i])) {
//includes 检测数组是否有某个值
newArr.push(arr[i]);
}
}
此处也可以拓展成使用reduce方法去做
以上都是ES6的一些方案,以下是一些老古董方案:
双层for循环+splice
const arr = [1, 2, 3, 4, 3, 2, 1]
for(var i=0; i<arr.length; i++){
for(var j=i+1; j<arr.length; j++){
//第一个等同于第二个,splice方法删除第二个
if(arr[i]===arr[j]){
arr.splice(j,1);
j--;
}
}
}
虽然我最不喜欢这样的方法,但他可以通过修改对比方式,实现对两个拥有相同属性的不同对象去重。
indexOf
const arr = [1, 2, 3, 4, 3, 2, 1]
const newArr = []
for (var i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i])
}
}
总结:以上并非是所有的数组去重方法,只是差不多这些也就够了。业务使用上基本可以直接照搬;但要注意的是,实际使用时,是否存在要对对象类型做去重的情况,如果需要的话,以上方案都需要一定程度的拓展甚至放弃(有些方法不好拓展)。
Event Loop 事件循环机制及Promise相关
【建议星星】要就来45道Promise面试题一次爽到底(1.1w字用心整理) - 掘金 (juejin.cn)
这是我以前看过关于Promise的博客,写得最好的一篇。我直接甩出链接。
未完待续,也可能没有待续,hhhhhhhhh