同步和异步,同步一次只能执行一个任务,而且必须一个任务执行完成才可以执行后面的操作,可能会出现卡死页面,而异步却可以一次同步执行多个任务,任务成功了就返回,在js执行过程中,是单线程,向执行同步任务,遇到异步任务先放置在一边,之后再执行。下面以网络请求为例子
//promise用法,写成同步写法,解决回调地狱写法,只是写成同步写法,没有解决异步问题
//普通异步的写法:$ajax(url:'',success(){
$ajax(url:'',success(){},error(){})
},error(){})
//promise写法,不适合有逻辑的网络请求,既是请求成功之后根据成功参数做判断再请求,如果还需要then()此时还需要new promise,不然写法比回调函数还麻烦
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)})
}
//读取多个文件,all方法是最重要
Promise.all([p1,p2]).then(function(res){
console.log('都成功')
//解构赋值,两边结构必须一样
var [arr1,arr2] = res
},function(err){
})
可以封装成一个函数
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另一个简化异步写法async await,非常适合有逻辑的网络请求
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()