- Promise.allSettled
優(yōu)勢： 在并發(fā)任務重艘虎，任務異嘲χ叮或者正常，都會返回對應的狀態(tài)（fulfilled 或者 rejected）和結果（業(yè)務value或者拒絕原因reason）,在then里通過過濾來得到想要的業(yè)務邏輯野建，最大限度的保障業(yè)務當前狀態(tài)的可訪問性属划。它的出現(xiàn)是解決 Promise.all的問題（如果某個任務出現(xiàn)異常reject,所有任務都會掛掉，Promise直接進入reject狀態(tài)）
Promise.allSettled([
Promise.reject({code: 500, msg: '異常'}),
Promise.resolve({code: 200,data: []}),
Promise.resolve({code: 200,data:[}),
]).then(ret => {
/*
0: { status: 'rejected', reason:{} }
1: { status: 'fulfilled', value:{} }
2: { status: 'fulfilled', value:{} }
*/
// 過濾掉rejected狀態(tài)候生，盡可能多的保證頁面區(qū)域數(shù)據(jù)渲染
renderContent(ret.filter(el => {
return el.status !== 'rejected';
}))
})
- 可選鏈
日常代碼:
var name = user && user.info && user.info.name
使用可選鏈:
var name = user?.info?.name
var age = user?.info?.getAge?.()
3.空值合并運算符
日常寫法：
var name = (user.data && user.data.name) || '小明'
使用空值合并運算符：
var name = `${user.name}級` ?? '暫無等級';
- dynamic-import(按需引入)
按需加載同眯，為了首屏加載更快，比如懶加載圖片等
el.onclick = () => {
import(`/path/index.js`)
.then(module => {
module.doSomthing()
})
.catch(err => {
// load error
})
}
