1. 预编译
1. 创建了ao对象
2. 找形参和变量的声明作为ao对象的属性名 值是undefined
3. 实参和形参相统一
4. 找函数声明会覆盖变量的声明
Function fn(a,c){
Console.log(a) // function a(){}
Var a = 123
Console.log(a) // 123
Console.log(c) // function c(){}
Function a(){}
If(false){
Var d = 678
}
Console.log(d) //undefined
Console.log(b) //undefined
Var b = function(){}
Console.log(b) // function (){}
Function c(){}
Console.log(c) // function c(){}
}
2. 防抖函数(用于echarts图,提升性能)
典型案例:(输入搜索)输入结束后n秒才进行搜索,n秒内又输入的内容,就重新计算时,解决搜索的bug
Function debounce(delay,callback){
Let timer
Return function(value){
clearTimeout(timer)
timer = setTimeout(function(){
Callback(value)
},delay)
}
}
Function fn(value){
Console.log(value)
}
3.节流函数:当触发事件的时候,保证一段时间内只调用一次事件处理函数
Function Thor(fun,wait){
Let tinerOut
Return function(){
If(!timerOut){
timerOut = setTimeout(function(){
Func()
timerOut = unll
},wait)
}
}
}
Function handle({
Console.log(Math.random)
})
Document.getElementById(‘button’).onclick = thro(handle,2000)
3. js事件循环机制(调用栈-微任务队列-消息队列)
Js中的异步操作,比如fetch, setTimeout, setInterval 压入到调用栈中的时候里面的消息会进入到消息队列中去,消息队列中,会等到调用栈清空后再执行。
Eg1:
Function fn1(){
Console.log(1)
}
Function fn2(){
Console.log(2)
Fn1()
Console.log(3)
}
Fn2()
输出结果:2,1,3
Eg2:
Function fn1(){
Console.log(1)
}
Function fn2(){
setTimerout(()=>{
Console.log(2)
},0)
Fn1()
Console.log(3)
}
Fn2()
输出结果:1,3,2
Promise, async, await的异步操作的时候会加入到微任务中去,会在调用栈清空的时候立即执行,调用栈中加入的微任务会立马执行。
Eg:
Var p = new Promise(resolve => {
Console.log(4)
Resolve(5)
})
Function fn1(){
Console.log(1)
}
Function fn2(){
setTimerout(()=>{
Console.log(2)
},0)
Fn1()
Console.log(3)
P.then(resolve =>{
Console.log(resolve)
})
}
Fn2()
输出结果:4,1,3,5,2