同步和異步,同步一次只能執(zhí)行一個(gè)任務(wù)寝受,而且必須一個(gè)任務(wù)執(zhí)行完成才可以執(zhí)行后面的操作,可能會(huì)出現(xiàn)卡死頁(yè)面罕偎,而異步卻可以一次同步執(zhí)行多個(gè)任務(wù)很澄,任務(wù)成功了就返回,在js執(zhí)行過程中锨亏,是單線程痴怨,向執(zhí)行同步任務(wù),遇到異步任務(wù)先放置在一邊器予,之后再執(zhí)行浪藻。下面以網(wǎng)絡(luò)請(qǐng)求為例子
//promise用法,寫成同步寫法乾翔,解決回調(diào)地獄寫法爱葵,只是寫成同步寫法,沒有解決異步問題
//普通異步的寫法:$ajax(url:'',success(){
? ? $ajax(url:'',success(){},error(){})
},error(){})
//promise寫法反浓,不適合有邏輯的網(wǎng)絡(luò)請(qǐng)求萌丈,既是請(qǐng)求成功之后根據(jù)成功參數(shù)做判斷再請(qǐng)求,如果還需要then()此時(shí)還需要new promise雷则,不然寫法比回調(diào)函數(shù)還麻煩
let p = new promise((resolve,reject)=>{
? ? $ajax(url:"",sccess(res){resovle(res)},err(err){reject(err)})
}
p.then(funcrion(res){},function(err){})
let p2 = new promise(resolve,rejexct){
? ???$ajax(url:"",sccess(res){resovle(res)},err(err){reject(err)})
}
//讀取多個(gè)文件,all方法是最重要
Promise.all([p1,p2]).then(function(res){
console.log('都成功')
//解構(gòu)賦值辆雾,兩邊結(jié)構(gòu)必須一樣
var [arr1,arr2] = res
},function(err){
})
可以封裝成一個(gè)函數(shù)
function createPromise(url){
?return new Promise((resolve,reject)=>{
? ? $ajax({
? ? url:url,
? ? success(res){
resolve(res)
},
error(err){
? ?reject(err)
}
})
})
}
Promise.all([
? ? createPromise(url),
? ? createPromise(url2)
]).then()
//es7另一個(gè)簡(jiǎn)化異步寫法async await,非常適合有邏輯的網(wǎng)絡(luò)請(qǐng)求
async function readdata(){
let data1 = await $ajax(url,'1.text',success(){},err(){}),
if(data1.type==vip){
? ?let vip = await $.ajax({url})
}else{
? let puton = await $.ajax({url})
}
let data2 = await $ajax(url,'2.text',success(){},err(){})
let data3 = await $ajax(url,'3.text',success(){},err(){})
}
readdate()