1. 同步
概念:同步就是后一个任务等待前一个任务执行完毕之后,再执行,执行顺序和任务的排列顺序一致。
2.异步
概念:异步是非阻塞的,异步逻辑与主逻辑相互独立,主逻辑不需要等待异步逻辑完成,而是可以立刻继续下去。
2.1 网络异步请求
2.2.1 一般用jquery中ajax去做网络请求
console.log(1);
$.ajax({
type:"get",
url:"http://mockapi.eolinker.com/test",
success:function(response){
console.log(response);
}
})
console.log(2);
2.2.2 promise
- 说一说promise是什么与使用方法?
(1)Promise的作用:Promise是异步微任务,解决了异步多层嵌套回调的问题,让代码的可读性更高,更容易维护Promise;
(2)Promise的使用:Promise是ES6提供的一个构造函数。
①可以使用Promise构造函数new一个实例;
②Promise构造函数接收一个函数作为参数,这个函数有两个参数,分别是两个函数 “resolve”和“reject”。
注:“resolve”将Promise的状态由等待变为成功,将异步操作的结果作为参数传递过去;“reject”则将状态由等待转变为失败,在异步操作失败时调用,将异步操作报出的错误作为参数传递过去。
③实例创建完成后,可以使用“then”方法分别指定成功或失败的回调函数,也可以使用catch捕获失败,then和catch最终返回的也是一个Promise,所以可以链式调用。
异步编程的一种解决方案,比传统的解决方案----回调函数和事件----更合理且强大。
有三个状态:
- pending:待定,初始状态;
- fulfilled:实现,操作成功;
- rejected:拒绝,操作失败。
var promise=new Promise(传一个函数);
var promise=new Promise(function(resolve,reject){
if(/* 异步操作成功 */){
resolve(value);
}else{
reject(error);
}
})
当promise状态发生改变,就会触发then()里的响应函数处理后续步骤。catch就是用来捕获异常的
Promise.then(res=>{
console.log(res);//成功 resolve('success')
}).catch(err=>{
console.log(err);//失败 reject('fail')
})
promise.all可以将多个promise实例包装成一个新的Promise实例。同时,成功和失败的返回值是不同的,成功的时候返回的是一个结果数组,而失败的时候则返回最先被reject失败状态的值。
let p1=new Promise((resolve,reject)=>{
resolve('成功了')
})
let p2=new Promise((resolve,reject)=>{
resolve('success')
})
let p3=Promise.reject('失败')
Promise.all([p1,p2]).then((result)=>{
console.log(resule)
}).catch((error)=>{
console.log(error);
})
Promise.all([p1,p3,p2]).then((result)=>{
console.log(resule)
}).catch((error)=>{
console.log(error);
})
2.2.3 Async / await
也是用来处理异步的,其实是Generator函数的改进,背后的原理就是Promise。
返回的是promise对象。
async function f3(){
return 'f3';
}
async function f4(){
return 'f4';
}
async function f5(){
var c=await f3();//await 是异步函数
var d=await f4();//await 是正常函数
//看到await 会阻塞后面的代码,等主程序执行完,再回来执行
}
如果await 是reject ,后面代码就不会执行,要加上try catch才hi执行。
async function f4() {
return Promise.reject('sss');
}
async function f5() {
try {
var c = await f3();
} catch (e) {
console.log(e);
}
}