雖然不知道promise是怎麼取得名稱,姑且讓它當作一個帶我們逃離回呼函式的地獄的一種“承諾”?!很好記!
改寫前面的古老的ajax call:XMLHttpRequest()
Jonas在非同步的章節,從古老的ajax call:XMLHttpRequest()帶學生體驗到“callback hell”,再到現在用fetch API來改寫古老的寫法,可以感受到老師的用心良苦!
用fetch API改寫
使用fetch API,這裡只是生成簡單的"get"請求,所以就不需要用到它本身提供的物件屬性,有寫在補充,未來可以查看
用Fetch Api改寫XMLHttpRequest的程式碼送出請求:
會立即得到一個promise/承諾
什麼是promise 承諾?
jonas把promise講得很清楚
ES6 Promise:逃離callback hell
使用promise的好處
- 使我們不再依賴事件和callback fn來處理非同步像是ajax call請求所得到的結果,因為事件以及callback fn常常會導致不可預料的錯誤狀況
- 除了使用巢狀的callback fn,有了promise就可以用非同步的方式操作“串接promise”的方式,例如:用.then()來串接promise,相比巢狀回呼地獄來的明朗多了
promise lifecycle
promise和非同步一起進行,需要知道的是,promise是有時間性的,所以promise可以處於不同的狀態,這就是promise 生命週期。
下章節是關於如何消耗一個promise
補充:
fetch API補充(fetch api也是一個函式)
老師提到在使用fetch API時,提到Fetch api函式可以指定物件屬性來使用,所以我大概用chatgpt稍微查了常用的物件屬性:
在 JavaScript 中,使用 fetch API 来进行网络请求时,你可以使用以下一些常用的属性:
- method(方法): 表示请求的 HTTP 方法,如 "GET"、"POST"、"PUT" 等。
- headers(头部): 一个 Headers 对象,表示请求的头部信息,可以设置或修改各种请求头,例如 "Content-Type"。
- body(请求体): 请求的主体数据,可以是一个字符串、一个 FormData 对象、一个 Blob 对象等。
- mode(模式): 请求的模式,如 "cors"、"no-cors"、"same-origin" 等。
- credentials(凭证): 表示是否在请求中包含凭证信息,如 "same-origin"、"include"、"omit" 等。
- cache(缓存): 请求的缓存模式,如 "default"、"no-store"、"reload" 等。
- redirect(重定向): 表示如何处理重定向,如 "follow"、"error"、"manual" 等。
- referrer(引用页): 请求的引用页,可以是 "no-referrer"、"client"、URL 等。
- referrerPolicy(引用页策略): 控制请求的引用页信息,如 "no-referrer-when-downgrade"、"strict-origin" 等。
- integrity(完整性): 用于验证资源完整性的哈希值,用于验证下载的资源是否被篡改。