前言
之前看PWA时，知道它使用的技术包括了fetch，然后就是把这些概念简单的记住，再多就不知道了。今天再看看fetch这个api，了解它的最好方法就是手写出来。
Fetch API 提供了一个 JavaScript接口，用于访问和操纵HTTP管道的部分，例如请求和响应。它还提供了一个全局 fetch()方法，该方法提供了一种简单，合理的方式来跨网络异步获取资源。
这种功能以前是使用 XMLHttpRequest实现的。Fetch提供了一个更好的替代方法，可以很容易地被其他技术使用，例如 Service Workers。
除此之外，Fetch 还利用到了请求的异步特性——它是基于Promise的。
get请求
这里给大家推荐两个网站：
http://jsonplaceholder.typicode.com/
http://myjson.com/
我这里用第二个网站，生成了一个JSON数据。
一个基本的 fetch请求设置起来很简单，这里发起一个get请求。看看下面的代码：
fetch('https://api.myjson.com/bins/of6pw')
.then(function(response) {
return response.json();
})
.then(function(myJson) {
console.log(myJson);
});
调用fetch函数，传入接口url，然后返回一个promise（response），为了获取JSON的内容，我们需要使用 json()方法，这个方法返回的也是一个promise。
输出结果：
post请求
发起一个post请求，这里用到了第一个网站的接口：
fetch('https://jsonplaceholder.typicode.com/posts', {
method: 'POST',
body: JSON.stringify({
name: "ceido",
age: 100
}),
headers: {
"Content-type": "application/json; charset=UTF-8"
}
})
.then(response => response.json())
.then(json => console.log(json))
输出结果：
看起来这比XMLHttpRequest简洁多了，但是不知道现在的使用情况怎么样，我知道的话就是在PWA中用到（然鹅现在PWA也悄无声息了？），对于一般的HTTP库如axios不知道有没有封装（没有，基于xhr）。一个新事物的出现到普遍使用是需要时间的，且不知道其是否能活下去。
配合Service Worker使用，可以看看这里：https://www.jianshu.com/p/778f37db5a49
参考：
https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
https://zhuanlan.zhihu.com/p/28206325
