iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 26
2
Modern Web

RE:從零開始的學習 JS 生活系列 第 26

EP.25 RE:從零開始的學習 JS 生活-第二十五日

  • 分享至 

  • xImage
  •  

前言

轉生第二十五日,這一篇主要稍微介紹一下什麼是 Callback Hell。

Callback Hell

Callback Hell 中文是回呼地獄,這種狀況在現階段程式開發是一件非常常見的事情,首先所謂的回呼地獄大致上常見的問題在於「我們希望事件可以依照我們要求的順序執行」,那這種時候就會發生 Callback Hell,這邊舉例一個我先前做的範例 ↓

RagnarokShopV3 作品其中一段 Callback Hell

由於我們希望程式碼可以依照我們希望的流程來跑,所以就會導致有非常多的 if…if… 判斷式來判斷資料是否取得或是處理完畢。

那 Callback Hell 在 debug 上其實是非常痛苦的,其中最主要的地方在於括號真的超級多,往往一個不小心你可能就會多刪掉一個括號,導致你要一行一行找問題。

如果都不做處理的話就會變成像波動拳的形式 ↓

波動拳!

那麼為什麼 Callback Hell 會發生呢?在 JavaScript 中這與它的語言特性有關係,所以你 Google Callback Hell 應該都會找到滿多都是在講 JavaScript 的,但是這邊要提醒一件事情 Callback Hell 並不存在於 JavaScript 世界中,而是在任何一個語言都有可能出現,這只是大家約定俗成的一種叫法而已。

那應該怎麼解決 Callback Hell?這邊剛好我先前有寫過關於解決 Callback Hell 的相關文章,其中裡面也會介紹 非同步與同步事件 的觀念,所以就直接貼上 LINK 不在寫一次了(圖畫的很累...)。

JavaScript 非同步與同步事件之 Promise

JavaScript 非同步與同步事件之 await

JavaScript 非同步與同步事件之 async

結尾

下一篇的 RE:從零開始的學習 JS 生活-第二十六日 將會介紹 ES6 的 let & const

本文同步發表於:https://hsiangfeng.github.io/javascript/20191010/574616303/


上一篇
EP.24 RE:從零開始的學習 JS 生活-第二十四日
下一篇
EP.26 RE:從零開始的學習 JS 生活-第二十六日
系列文
RE:從零開始的學習 JS 生活32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言