fetch竟然都是瀏覽器自帶的了?==》window.fetch
現在window.fetch基本上每一個瀏覽器都已經自帶(IE除外),以後再也不用引入$.ajax、axios、fetch了就能用了
axios沒有這殊榮,原生自帶意味著什麼,不用說什麼了、多麼重要能讓window當中自帶fetch方法,以前聽過一種說法叫傳統ajax已死,fetch永生,當時還以為是一句笑話,現在看來,fetch已經征服了各個js大佬,正在走向通用化的道路
如果fetch組建通用之後,不再考慮瀏覽器相容問題,那麼會有多麼可怕的事實、就是強迫所有人放棄任何ajax封裝方法、因為這是自帶的,無論你使用與否,瀏覽器都會把它放到window物件當中,對於那些對網頁效能要求極高的前段工作者們,是絕對不會允許自己的程式碼中引入不必要的程式碼、而對於那些不願意引入資源的人、也會強迫自己熟悉fetch得到使用方法
所以說fetch走向了成功!!!!!!!
總結一下,Fetch 優點主要有:
-
語法簡潔,更加語義化
-
基於標準 Promise 實現,支援 async/await
-
同構方便,使用 isomorphic-fetch
先看一下 Fetch 原生支援率:
原生支援率並不高,幸運的是,引入下面這些 polyfill 後可以完美支援 IE8+ :
-
由於 IE8 是 ES3,需要引入 ES5 的 polyfill: es5-shim, es5-sham
-
引入 Promise 的 polyfill: es6-promise
-
引入 fetch 探測庫:fetch-detector
-
引入 fetch 的 polyfill: fetch-ie8
-
可選:如果你還使用了 jsonp,引入 fetch-jsonp
-
可選:開啟 Babel 的 runtime 模式,現在就使用 async/await
Fetch polyfill 的基本原理是探測是否存在 window.fetch
方法,如果沒有則用 XHR 實現。這也是 github/fetch 的做法,但是有些瀏覽器(Chrome 45)原生支援 Fetch,但響應中有fetch-detector
和 fetch-ie8
只在瀏覽器穩定支援 Fetch 情況下才使用原生 Fetch。這些庫現在每天有幾千萬個請求都在使用,絕對靠譜!
最後說一句 傳統AJAX已死,Fetch永生!!