携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第八天,点击查看活动详情
前言
前端与后端的交互,往往充斥着大量的api接口调用,而这些接口调用往往都是异步的,而解决异步问题,无非不是通过promise
,就是通过async
和 await
。
用过promise的应该都知道,往往要进行链式调用。而用async
和 await
的,确总要用async
给代码进行包裹一层。当然这也无可厚非,但是如果你只想看看这个接口的返回结果或者说是否能够调通的话,这样是稍显繁琐一点的。
如果你试过在浏览器中调用接口的话,你会发现,一切是这么的简洁。
await
我在必应首页随便找了个接口为例:
使用promise:
使用async:
看起来不是很简洁,其实在console中是可以直接使用await的,你不需要嵌套async 他会直接帮你处理好。你甚至可以不使用console.log()。
点击右侧的链接,跳转的源码。
(async () => {
res = await fetch('https://cn.bing.com/hp/api/model?FORM=Z9FD1')
return (await res.json())
}
)()
你会发现,他已经自动的给你包裹好了,甚至你都不用通过log打印,因为他已经给你自动返回了。
console.log()
当你声明一个Object的时候,打印它,并修改,打印,你会发现一个有意思的现象。
const stu = {
name: 'mike',
age: 20
}
console.log(stu)
stu.name = 'tom'
stu.age = 22
console.log(stu)
你会发现,他打印的是正常的值,而你点击打印的对象展开的时候,确实引用的值。并且他还会提示Value below was evaluated now.
这一点不得不说,google做的还真是挺贴心的。