0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

JavaScriptを基本からまとめてみた【16】【async / await】

Last updated at Posted at 2021-08-22

##はじめに

####学習するに至った経緯
2020年より、未経験からエンジニアへの転職を目指し、某プログラミングスクールへ通う。入学後、『Ruby』を未経験から学ぶ人が多いのと『Ruby』の求人が思っていた以上に少ないので、卒業後、フロントエンドのエンジニアを目指す事に。
Javascriptの学習した事を言語化し、認識の深化による備忘録として記載。

##「async/await」とは
『async / await』とは、Promise系の処理を同期的な書き方で書ける画期的な構文。
要するに、『async / await』を使えば、記述がシンプルで、途中に非同期処理があっても上から下にコードが読めるようになり、直感的でわかりやすい。Promiseによる非同期処理をより簡潔に効率よく記述できるのが大きな特徴。最大の利点は、「for文やwhile文で利用できる」こと。従来の書き方では、繰り返し処理の非同期化のために再帰処理を施したりと、とても複雑なプログラムになりがちだったが改善された。

##「async/await」の使い方
・ 非同期処理を伴う関数定義に async をつける
・ 非同期処理を伴う関数実行時に await をつける
・ awaitはasync付き関数内でしか使えない

sample.js
const asyncAwaitFunc = async() => {
  const hoge = await someAsynchronousFunc(() => {
//何かしらの非同期処理
 }).then(() => {
//非同期処理が成功した場合
  return '成功!'
 }).catch(() => {
//非同期処理が失敗した場合
  return '失敗!'
 })
}

##参考サイト
[【JavaScript入門】5分で理解!async / awaitの使い方と非同期処理の書き方]
(https://www.sejuku.net/blog/69618)
[JavaScriptのasync/await 理解してますか? 説明できますか? クイズに答えてもらって良いですか?]
(https://www.youtube.com/watch?v=T-_0Pc5P12U)
[非同期処理の完了を待つ方法!Promise&async/await【分かりすぎて怖いJavaScript入門】]
(https://www.youtube.com/watch?v=Vhnz1V-v1cU&t=1364s)

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?