搜索

es6中的await与promise的区别？

javascript

网友回复

async/await是写异步代码的新方式，以前的方法有回调函数和Promise。
async/await是基于Promise实现的，它不能用于普通的回调函数。
async/await与Promise一样，是非阻塞的。
async/await使得异步代码看起来像同步代码，这正是它的魔力所在。

by bfwui

试想一下，我们有一个getJSON方法，该方法发送一个异步请求JSON数据，并返回一个promise对象。这个promise对象的resolve方法传递异步获得的JSON数据。具体例子的使用如下：

<script>
const makeRequest = () =>
    getJSON()
        .then(data => {
            console.log(data)
            return "done"
        })
 
makeRequest()
</script>

在使用async/await时，写法如下：

<script>
const makeRequest = async () => {
    console.log(await getJSON())
    return "done"
}
 
makeRequest()
</script>

对比两种写法，针对第二种，我需要进一步说明：

1）第二种写法（使用async/await），在主体函数之前使用了async关键字。在函数体内，使用了await关键字。当然await关键字只能出现在用async声明的函数体内。该函数会隐式地返回一个Promise对象，函数体内的return值，将会作为这个Promise对象resolve时的参数。
可以使用then方法添加回调函数。当函数执行的时候，一旦遇到await就会先返回，等到异步操作完成，再接着执行函数体内后面的语句。

2）示例中，await getJSON() 说明console.log的调用，会等到getJSON()返回的promise对象resolve之后触发。

我们在看一个例子加强一下理解，该例子取自阮一峰大神的《ECMAScript 6 入门》一书：

function timeout(ms) {
    return new Promise((resolve) => {
        setTimeout(resolve, ms);
    });
}
 
async function asyncPrint(value, ms) {
    await timeout(ms);
    console.log(value);
}
 
asyncPrint('hello world', 50);

上面代码指定50毫秒以后，输出hello world。

Async/await是近些年来JavaScript最具革命性的新特性之一。他让读者意识到使用Promise存在的一些问题，并提供了自身来代替Promise的方案。
当然，对这个新特性也有一定的担心，体现在：
他使得异步代码变的不再明显，我们好不容易已经学会并习惯了使用回调函数或者.then来处理异步。新的特性当然需要时间成本去学习和体会；
退回来说，熟悉C#语言的程序员一定会懂得这些学习成本是完全值得的。

by bfwui

我知道答案，我要回答

我有问题