初学Fetch

什么是 Fetch API？

1. Fetch 提供了 Request 和 Response对象（以及与网络请求有关的其他内容）的一般定义。

2. Fetch API 提供了 fetch() 方法，它被定义在 BOM 的 window 对象中，你可以用它来发起对远程资源的请求。

3. fetch() 方法返回的是一个Promise对象，让你能够对请求的返回结果进行检索

为什么使用 Fetch API？

十多年来，XMLHttpRequest 对象一直被 AJAX 操作所接受，但是我们知道，XMLHttpRequest 对象的 API 设计并不是很好，输入、输出、状态都在同一个接口管理，容易写出非常混乱的代码。那么Fetch API就应势而生，提供了一种新规范，用来取代善不完美的 XMLHttpRequest 对象。

Fetch API 主要有两个特点：

1. 一是接口合理化，AJAX 是将所有不同性质的接口都放在 XHR 对象上，而Fetch是将它们分散在几个不同的对象上，设计更合理；
2. 二是Fetch操作返回 Promise 对象，避免了嵌套的回调函数。

            fetch('http://localhost:8080/api')
            .then(res => {
             //1. 返回的响应式JSON格式的，所以调用response.json方法来转换数据。
             //2. 请求一个XML格式文件，则调用response.text。
             //3. 请求图片，使用response.blob方法。
             //这些方法返回另一个Promise，所以可以调用.then方法处理我们转换后的数据。
                return res.json();
            })
            .then(data => {
                console.log(data);
            });