***callback
这个是最常用的也是最简单的 ,比如在ajax网络请求中,返回请求完成返回的数据
回调函数就是把一个函数当成另一个函数的参数,可以传递函数内的局部变量,也可以异步完成一些操作,在函数的实现里调用回调函数,在函数的调用里实现回调函数
// 回調函數的方式 閉包 可以獲取函數內部的局部變量
function testCallback(callback) {
let a = 1;
let b = 2;
if (a < b) {
callback && callback(a);
}
}
// 调用
testCallback((res) => {
console.log(res, 'this is callback')
});
***promise
ES6 的一种解决异步函数的方法
promise就是一个对象,用来传递异步操作的消息,他代表了某个未来才会知道结果的是事件(通常是一个异步操作),有三种状态,未完成,resolve,rejec,
promise的构造函数接受一个函数作为参数,该函数的两个参数分别又是两个方法 resolve() 和 reject()
function testPromise() {
return new Promise((resolve, reject) => {
let a = 2
let b = 1
if (a > b) {
resolve(a)
} else {
reject(b)
}
})
}
function testPromise1() {
return new Promise((resolve, reject) => {
let a = 10
let b = 5
if (a > b) {
resolve(a)
} else {
reject(b)
}
})
}
// 那么接下来就可以链式调用了 1执行完执行2
// 用promise來順序執行多個異步函數
testPromise().then((resolve) => {
console.log(resolve)
return testPromise1();
}).then((res) => {
console.log(res, 'this is promise');
}).catch((err) => {
console.log(err);
})
// 并发执行 异步函数 所有函数执行完再返回结果
let promise = testPromise();
let promise1 = testPromise1();
Promise.all([promise, promise1]).then((res) => {
console.log(res, 'this is promiseAll');
})
// 竞速执行 res返回第一个执行完成的异步函数
Promise.race([promise, promise1]).then((res) => {
console.log(res, 'this is promiseRace');
})
*** async await 是ES7的一个标准 为了解决多个promise的嵌套,让异步函数看起来像同步函数一样清晰,配合promise使用
注意 只有在async 函数里才可以使用await
// 用async await 來順序執行多個異步函數
async function testAsync() {
try {
let a = await testPromise();
let b = await testPromise1();
console.log(a, b, 'this is async');
} catch (err) {
console.log(err)
}
}
testAsync();
awiat 后面等待的是一个promise函数,它会等到promise函数返回对应的状态再执行后面的代码