解决异步(重点promise函数)
1. 回调函数的方式
function func(callback){ setTimeout(()=>{ callback("异步数据") },1000) } func(function (res){ console.log(res) })
2. 通过Promise解决异步问题
定义:这个是ES6新出的解决异步问题的语法,通过promise可以避免回调函数产生的回调地域的问题
使用实例:
有两个参数:resolve(解决)和reject(拒绝) 都是方法
let pro = new Promise((reslove,reject)=>{ // 异步操作放在这个里面,一旦创建promise对象,就会执行这里的代码 // 通过 reslove标识执行成功 reslove(参数). 这里reslove的参数, // 通过reject标识失败, reject(参数) }) pro.then(res=>{ // 这个res就是reslove的时候括号里写的数据 }).catch(err=>{ // 这个err就是reject的时候括号里的数据 })
Promise对象有三种状态:
1.pending:刚刚创建一个Promise实例的时候,表示初始状态;
2.fulfilled:resolve方法调用的时候,表示操作成功;
3.rejected:reject方法调用的时候,表示操作失败;
.then方法
参数是两个函数,第一个用于处理操作成功后的业务,第二个用于处理操作异常后的业务。
promise的链式调用
promise通过链式调用解决回调地域的问题
Promise的.then方法返回的还是一个Promise对象,这个Promise的状态是由上一个.then方法中函数的返回值的决定
- 上一个.then返回了一个Promise对象。 这里得到的状态就和这个Promise对象一样
- 上一个.then返回了一个非Promise对象。可以直接在后续函数拿到这个数据
promise.then(function (data) { console.log(data); })
Catch方法
对于操作异常的程序,使用catch catch只接受一个参数(error),用于处理操作异常后的业务
then方法和catch方法调用后,都会返回promise对象。
实例:
promise.then(function (data) { console.log(data); }).catch(function (error) { console.log("失败") })
Promise.all方法
Promise.all()方法:接受一个数组作为参数,数组的元素是Promise实例对象,当参数中的实例对象的状态都为fulfilled时,Promise.all()才会有返回。
let promise = new Promise((reslove, reject) => { setTimeout(() => { reslove("第一个完了"); }, 1000); }) let promise2 = new Promise((reslove, reject) => { setTimeout(() => { reslove("第二个完了"); }, 1000); }) let promise3 = new Promise((reslove, reject) => { setTimeout(() => { reslove("第三个完了"); }, 1000); }) let promise4 = new Promise((reslove, reject) => { setTimeout(() => { reslove("第四个完了"); }, 1000); }) //Promise.all()方法:接受一个数组作为参数,数组的元素是Promise实例对象,当参数中的 // 实例对象的状态都为fulfilled时,Promise.all()才会有返回。 Promise.all([promise, promise2, promise3, promise4]).then((data) => { console.log(data); })
Promise.race方法
只要有一个状态发生变化(不管是成功fulfilled还是异常rejected),它就会有返回
Promise.race([promise, promise2, promise3, promise4]).then((data1) => { console.log(data1); })