技術標籤：jsjavascriptjs

async、await使用方法

• async
• await

async

其實很多新同學都會問 這個async是幹嘛的 到底對我的程式碼有什麼影響？

在函式前面新增async
1、可以結合使用await(下面講這個)
2、return出來的就是一個promise

1. 用法1

const test = async ()=> {return 'test'}

2. 用法2

async function test () {return 'test'}

3. 用法3

 async test() {return 'test'}

consoel.log出來如下圖：

await

必須結合async 使用

用法1：解析promise

const test = async ()=> {
 const test = await Promise.resolve('test')
 console.log(test,'test')
}

效果如下

用法2：等待
test1執行完成後執行 test2 在然後執行test3 …
其實咱們再寫程式碼的時候會出現多個函式呼叫然後想讓某一個函式執行完成後，再執行另一個 就可以用到這個

const test = async ()=> {
 const test1 = await Promise.resolve
 
('test1')
 const test2 = await Promise.resolve('test2')
 const test3 = await Promise.resolve('test3')
 const test4 = await Promise.resolve('test4')
 console.log(test1,test2,test3,test4,'test')
 return 'test'
}

其實我個人比較喜歡這個async await 給了我跟很多方便 不用再去寫巢狀的promise了 不用再去then 做嵌套了
例如下面：

const params = {page:
 
 1,size: 10}

//then的方式
const test = () => {
  axios.post(params).then(response => {
     console.log('response',response)
 })
}

//async、await
const test1 = async () => {
   const response = await axios.post(params)
   console.log(response)
}

async 確實好用 贊