场景1
//场景1： 两个异步方法 独立的
var asyncFn1 = (x) => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(x);
}, 3000)
})
}
var asyncFn2 = (y) => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(y);
}, 1000)
})
}
async function asyncTest() {
console.log("async 开始");
let x = await asyncFn1("asyncFn1");
console.log(x);
let y = await asyncFn2("asyncFn2");
console.log(y)
console.log("async 结束")
}
console.log("外层 开始");
asyncTest();
console.log("外层 结束");
//打印结果
/**
*
* 外层 开始
async 开始
外层 结束
asyncFn1
asyncFn2
async 结束
*
*/
场景2
let map = new Map();
let mapValue = "";
//场景2： 两个异步方法 先后顺序
var asyncFn1 = (x) => {
return new Promise((resolve) => {
setTimeout(() => {
map = x;
resolve(map);
}, 3000)
})
}
var asyncFn2 = (y) => {
return new Promise((resolve) => {
setTimeout(() => {
mapValue = map.get(y);
resolve(mapValue);
}, 1000)
})
}
async function asyncTest() {
console.log("async 开始");
let m = new Map();
m.set("key", "value");
let x = await asyncFn1(m);
console.log(x);
let y = await asyncFn2("key");
console.log(y)
console.log("async 结束")
}
console.log("外层 开始");
asyncTest();
console.log("外层 结束");
//打印结果
/**
*
* 外层 开始
async 开始
外层 结束
map对象
value
async 结束
*
*/
场景3
let map = new Map();
let mapValue = "";
//场景3： 一个同步方法一个异步方法 先后顺序（同步方法依赖异步方法值， 就是说期望的 异步方法先执行，同步然后再执行）
var asyncFn = (x) => { //异步方法，生成map对象
return new Promise((resolve) => {
setTimeout(() => {
map = x;
resolve(map);
}, 3000)
})
}
var syncFn = (y) => { //同步方法，通过map对象获取vaule
mapValue = map.get(y);
return mapValue;
}
async function asyncAndsyncTest() {
console.log("asyncAndsync 开始");
let m = new Map();
m.set("key", "value");
let x = await asyncFn(m);
console.log(x);
let y = syncFn("key");
console.log(y)
console.log("asyncAndsync 结束")
}
console.log("外层 开始");
asyncAndsyncTest();
console.log("外层 结束");
//打印结果
/**
*
* 外层 开始
asyncAndsync 开始
外层 结束
map对象
value
asyncAndsync 结束
*
*/
场景4
let map = new Map();
let mapValue = "";
//场景4： 一个同步方法一个异步方法 先后顺序（同步方法依赖异步方法值， 就是说期望的 异步方法先执行，同步然后再执行）(原始方法解决)
var asyncFn = (x) => { //异步方法，生成map对象
setTimeout(() => {
map = x;
}, 1000)
}
var syncFn = (y) => { //同步方法，通过map对象获取vaule
mapValue = map.get(y);
return mapValue;
}
function asyncAndsyncTest() {
console.log("asyncAndsync 开始");
let m = new Map();
m.set("key", "value");
asyncFn(m);
setTimeout(() => {
console.log(map);
let y = syncFn("key");
console.log(y)
}, 2000)
console.log("asyncAndsync 结束")
}
console.log("外层 开始");
asyncAndsyncTest();
console.log("外层 结束");
//打印结果
/**
*
* 外层 开始
asyncAndsync 开始
外层 结束
map对象
value
asyncAndsync 结束
*
*/
总结
async是ES7
async语法使得代码简洁清晰，不需要写那么多的箭头函数，避免了代码嵌套
async在接收上一个返回值为参数时，比较方便
async/await与Promise一样，是非阻塞的。
async函数是Generator 函数的语法糖 ，async函数就是将 Generator 函数的星号（*）替换成async，将yield替换成await；进一步说就是async函数完全可以看作多个异步操作，包装成的一个 Promise 对象，而await命令就是内部then命令的语法糖。
