JavaScript

【JavaScript】コールバック関数の利用例 – 非同期処理(動画解説付き)

どうも、つよぽん(@tsuyopon_xyz)です!

今回は、前回と同じように「コールバック関数」の具体的な利用例を紹介したいと思います。

今回紹介する利用例は「非同期処理」でのコールバック関数の実装です。

仕事レベルで本格的にWebアプリを開発する場合、「API」というものを活用したプログラミングの知識が求められます。

そして、この「API」を使ったプログラミングで「非同期処理」が行われて、その「非同期処理」を実装するのにコールバック関数が使われるといった感じです。

今回の解説動画の終わりの方で「fetchを使う(APIを使って外部サービスとデータのやりとりを行う)」というものがあります。

その部分で「API」を使ったプログラミングをしているので、

APIを使ったプログラミングってどういうものなんだろう?

と思っている方は、そちらの解説を参考にしていただけたらと思います^^

【キャラ講義】デザイナー・ディレクターにもわかるAPI解説」という解説記事も用意しているの、

  • APIって何?
  • APIのイメージをもう少し掴みたい
  • APIはどういうところで使われているの?

といった方は、

【キャラ講義】デザイナー・ディレクターにもわかるAPI解説」も参考にしていただけたらと思います。

 

もし、非同期処理の実装以前に、「コールバック関数」そのものの理解が怪しいという場合は、

以前解説した「コールバック関数」の基本の解説記事を先に読むことをオススメします^^

解説動画

動画目次
  • 00:00 イントロ
  • 00:43 HTMLとJavaScriptの下準備をする
  • 02:08 setTimeoutを使う
  • 04:07 Promiseを使う
  • 09:27 fetchを使う(APIを使って外部サービスとデータのやりとりを行う)
 

動画内で実装したコードと、参考記事は以下のリンク先でご確認いただけます。

 

追伸

今回の記事は「【初心者向け】Webエンジニア養成メルマガ講座」でお送りしているメール講座の一部のコンテンツとなります。

コールバック関数などのプログラミングスキル以外にも、「Webエンジニアを目指す上で身につけたほうが良い知識や情報」を1日1通無理なく学習したい場合は、

ぜひ、「【初心者向け】Webエンジニア養成メルマガ講座」の詳細をご確認いただけたらと思います。

 

メルマガ講座の詳細を確認する

【3つの特典付き】Webエンジニアに必要な基礎スキルを体系的に効率良く身につけたいですか?

LINE登録で無料特典を受け取る

次のような方向けに、学習をサポートするコンテンツを無料プレゼントしています。

  • Webエンジニアになりたいけど何から学習を始めれば良いかわからない
  • 今まで独学で頑張ってきたけど、独学に限界を感じてきた
  • プログラミングは出来るけど、大きめのコードが書けない

「プレゼント詳細が知りたい」「プレゼントを受け取りたい」といった方は、以下のボタンをクリックして詳細ページをご確認ください。

無料特典を受け取る

 

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です