持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第21天，点击查看活动详情
let和const区别
var：有预解析，没有块级作用域
let：没有预解析，有块级作用域
let num=10
num=20
console.log(num)//20 值可以改变
let 是变量 、let声明的变量值是可以改变的
const num1=10
num1=20
console.log(num1)//10 值不可以改变
const是常量、值不可以改变
常量只能在声明的时候赋值一次，之后无法改变
const声明引用类型指的是栈内存不可修改
解构赋值
变量赋值的简写形式
对象解构赋值
注意要是同名属性，不同名只能混合用
第一种：取出对象的值 赋值给 变量
let obj={
name:'张三',
age:18,
sex:'nan'
}
//ES5传统赋值方式
let name=obj.name
let age=obj.age
ES6解构赋值
声明变量，自动取右边对象的同名属性赋值
let {name,age,sex}=obj
第二种：取出变量值，赋值给对象
let name='张三'
let age=18
//ES5传统赋值方式
let obj={
name:name,
age:age,
eat:function(){
console.log('123')
}
}
ES6解构赋值 同名
let obj={
name, // name:name
age, // age:age
eat(){//eat:function(){}
console.log('123')
}
}
左边 是给谁，右边 是取谁，变量花括号
默认值 备胎
数组解构赋值
//第一种：将数组的值赋值给变量
let arr = [1, 2, 3, 4]
let [num1, num2, num3, num4] = arr
console.log(num1, num2, num3, num4)//1,2,3,4
//第二种 将变量的值赋值给数组
let a = 1
let b = 2
let c = 3
let arr2 = [a, b, c]
console.log(arr2)//[1,2,3]
函数参数解构赋值
let obj = {
name: '张三',
sex: "男",
age: 16
}
function fn({ name, sex, age }) { //形参会声明变量 类似let {name, sex, age} 最终显示let {name, sex, age}=boj
console.log(name, sex, age)
}
fn(obj)
函数解构赋值，实参必须的对象，则形参可以使用解构赋值
函数默认值 备胎
箭头函数
箭头函数：其实就是function的 简写
箭头函数语法：（1）去掉function，改成=>
（2）形参小括号移到=>左边
（3）let 函数名= ()=>{}
//原来的具名函数和匿名函数
function fn() {
console.log(11)
}
fn()
let fn1 = function () {
console.log(22)
}
fn1()
箭头函数 let fn = (形参) => {函数代码}
let fn = (a, b) => {
return a + b
}
console.log(fn(1, 2))
如果只有一个形参，则可以省略形参小括号(没有参数不能省)
let fn1 = a => {
return a * 10
}
console.log(fn1(1))
如果大括号只有一行代码，则可以省略大括号，此时return也必须要省略
let fn2 = a => a * 10
console.log(fn2(1))
箭头函数的this指向：通过作用域链，指向上一级的this
展开运算符
作用：相当于遍历对象的简写
场景：添加数组
展开运算符 ...
//将arr2的所有元素 添加到arr1数组里
let arr1=[1,2,3,4,5]
let arr2=[6,7,8,9]
arr1.push(...arr2)//展开 arr1.push(arr2[0],arr2[1]...)
set数据类型
作用：set是集合，里面存储不重复的元素
场景：数组去重
let set=new Set(参数)
let set=new Set([1,2,3,3,4,4,5,6])
consolo.log(set)//{1,2,3,4,5,6}
set转成数组类型
let arr=[...set]//将set里的数据一一的展开
console.log(arr)//[1,2,3,4,5,6]
性能优化
函数防抖
作用：连续多次触发某个事件，则只执行最后一次
场景：手风情、搜索框
步骤：
（1） 声明变量存储定时器id 第一次赋值为null
（2）在每一次事件触发时，清理上一次的定时器
（3）事件触发时，先不触发，开启定时器，时间到了再触发
函数节流
作用：间隔时间内，事件只被触发一次
场景：降低高频事件触发的频率 比如：onmousemove onscroll
步骤：
（1）声明一个变量time存储上一次的触发时间 第一次赋值为null
（2）判断，当前触发时间-上一次触发的时间 是否符合我节流的时间
（3）符合就触发，并且time保存本次触发时间，它就变成上次触发时间了
