今天主要是学习了async和await,async对于现阶段处理异步来说是一种很好的方法了。
基本规则:
- async表示一个async函数,await只能用在其函数里面;
- await表示等待promise返回有结果了,然后才能继续向下执行;
- await后面跟着的是一个promise对象。
基本用法
首先,必须是一个promise对象
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve('ok');
}, time);
})
};
var start = async function () {
console.log('start');
var result - await sleep(1000);
console.log(result);
console.log('end');
};
start();
最后返回的结果是:
如果sleep中返回的不是一个promise对象,则await后得到的结果是一个undefined
var sleep = function (time) {
setTimeout(function () {
console.log('ok');
}, time);
};
var start = async function () {
console.log('start');
var result - await sleep(1000);
console.log(result);
console.log('end');
};
start();
得到的结果为:
关于其作用域
await只能在async的上下文中才能执行,否则会报错
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve('ok');
}, time);
})
};
var start = async function () {
//[1, 2, 3, 4, 5, 6].forEach(function (index) { // SyntaxError: Unexpected identifier
//console.log(`${index}次`);
//await sleep(1000);
//});
for (var i = 0; i < 10; i++) {
console.log(`${i} 次`);
await sleep(1000);
}
}
start();
如果不是在同一个上下文中,那么await则会报错。
最后
这里有一个小技巧,就是如果要输出1~10,那么除了通过闭包的方式外,还有通过async的方式去获取。
// method 1
for (var i = 0; i < 10; i++) {
(function (i) {
setTimeout(function () {
console.log(`${i} 次`);
}, 1000);
})(i);
}
// method 2
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve('ok');
}, time);
})
};
var start = async function () {
for (var i = 0; i < 10; i++) {
console.log(`${i} 次`);
await sleep(0);
}
}
start();