异步问题
1. 回调函数的方式
|
1
2
3
4
5
6
7
8
9
10
|
function func(callback){ setTimeout(()=>{ callback("异步数据") },1000)}func(function (res){ console.log(res)}) |
2. 通过Promise解决异步问题
定义：这个是ES6新出的解决异步问题的语法，通过promise可以避免回调函数产生的回调地域的问题
使用实例：
有两个参数：resolve(解决)和reject(拒绝) 都是方法
|
1
2
3
4
5
6
7
8
9
10
11
|
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对象。可以直接在后续函数拿到这个数据
|
1
2
3
|
promise.then(function (data) { console.log(data);}) |
Catch方法
对于操作异常的程序，使用catch catch只接受一个参数(error)，用于处理操作异常后的业务
then方法和catch方法调用后，都会返回promise对象。
实例：
|
1
2
3
4
5
|
promise.then(function (data) { console.log(data);}).catch(function (error) { console.log("失败")}) |
Promise.all方法
Promise.all()方法：接受一个数组作为参数，数组的元素是Promise实例对象，当参数中的实例对象的状态都为fulfilled时，Promise.all()才会有返回。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
let promise = new Promise((reslove, reject) => { setTimeout(() => { reslove("第一个完了"); }, 1500);})let promise2 = new Promise((reslove, reject) => { setTimeout(() => { reslove("第二个完了"); }, 1000);})let promise3 = new Promise((reslove, reject) => { setTimeout(() => { reslove("第三个完了"); }, 2000);}) //Promise.all()方法：接受一个数组作为参数，数组的元素是Promise实例对象，当参数中的 // 实例对象的状态都为fulfilled时，Promise.all()才会有返回。Promise.all([promise, promise2, promise3]).then((data) => { console.log(data);}) |
Promise.race方法
只要有一个状态发生变化（不管是成功fulfilled还是异常rejected），它就会有返回
|
1
2
3
|
Promise.race([promise, promise2, promise3]).then((data1) => { console.log(data1);}) |
