函数防抖和节流、以及Promise.all实现
防抖
所谓防抖,就是指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间。
1 2 3 4 5 6 7 8 9 10 11 12 13 14
| function debounce(fn, time) { let _t; return function () { clearTimeout(_t); _t = setTimeout(() => { fn(); }, time) } } function handleresize() { console.log(1); }
window.onresize = debounce(handleresize, 5000);
|
节流
所谓节流,就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率。
1 2 3 4 5 6 7 8 9 10 11 12 13
| function throttle(fn, delay) { let currentTime = new Date().getTime(); return function () { if (new Date().getTime() - currentTime > delay) { fn(); currentTime = new Date().getTime(); } } } function handleresize() { console.log(1); } window.onresize = throttle(handleresize, 5000);
|
Promise.all、Promise.race模拟实现
Promise.all
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
| function PromiseAll(promiseArr) { if(!Array.isArray(promiseArr)) throw new Error('The arguments must be a Array'); let len = promiseArr.length, value_arr = [], count = 0; return new Promise((resolve, reject) => { for(let i = 0; i < len; i++) { Promise.resolve(promiseArr[i]).then(value => { value_arr[i] = value; count++; if(count == len) { resolve(value_arr); } }).catch(reason => { reject(reason); }) } }) }
let p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve(1); }, 5000) }); let p2 = new Promise((resolve, reject) => { setTimeout(() => { resolve(2); }, 6000) }); let p3 = new Promise((resolve, reject) => { setTimeout(() => { resolve(3); }, 7000) });
PromiseAll([p1,p2,p3]).then(valArr => { console.log(valArr); }).catch(reason => { console.log(reason); })
|
Promise.race
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31
| function PromiseRace(promiseArr) { if(!Array.isArray(promiseArr)) throw new Error("The arguments must be a Array"); let len = promiseArr.length; return new Promise((resolve, reject) => { for(let i = 0; i < len; i++) { Promise.resolve(promiseArr[i]).then(value => { resolve(value); }).catch(reason => { reject(reason); }) } }) }
let p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve('5秒'); }, 5000); })
let p2 = new Promise((resolve, reject) => { setTimeout(() => { resolve('3秒'); }, 3000); })
PromiseRace([p1,p2]).then(value => { console.log(value); }).catch(reason => { console.log(reason); })
|