1.fetch()的基本用法

fetch("/test").then(res=>{return res.json();}).then(res=>{console.log(res);}).catch(err=>{console.log(err);})

2.fetch(url,options)的参数解析

2.1第一个参数是请求的url

第一个参数是请求的url

2.2第二个参数 options对象常用配置

第二个参数 options对象常用配置：

method: 请求使用的方法，如 GET、POST。

headers: 请求的头信息，形式为 Headers 的对象或包含 ByteString 值的对象字面量。

body: 请求的 body 信息：可能是一个 Blob、BufferSource、FormData、URLSearchParams 或者 USVString 对象。注意 GET 或 HEAD 方法的请求不能包含 body 信息。

mode: 请求的模式，如 cors、 no-cors 或者 same-origin。

same-origin表示必须同源，绝对禁止跨域，这个是老版本浏览器默认的安全策略。
no-cors这个就很特殊了，字面意思是禁止以CORS的形式跨域，其实它的效果是，对外域的请求可以发送，外域服务器无论设不设Access-Control-Allow-Origin: *都会接收请求并处理请求，但是浏览器不接收响应，即使外域返回了内容，浏览器也当做没接到

3.Fetch的Headers对象

你可以通过 Headers() 构造函数来创建一个你自己的 headers 对象。

var myHeaders = new Headers();
myHeaders.append("Content-Type", "text/plain");
myHeaders.append("Content-Length", content.length.toString());
myHeaders.append("X-Custom-Header", "ProcessThisImmediately")

myHeaders = new Headers({"Content-Type": "text/plain","Content-Length": content.length.toString(),"X-Custom-Header": "ProcessThisImmediately",
});

4.Fetch的Response对象

4.1Response.clone()

创建一个Response对象的克隆

4.2Response.json()

读取 Response对象并且将它设置为已读（因为Responses对象被设置为了 stream 的方式，所以它们只能被读取一次） ,并返回一个被解析为JSON格式的promise对象

4.3Response.text()

读取 Response对象并且将它设置为已读（因为Responses对象被设置为了 stream 的方式，所以它们只能被读取一次） ,并返回一个被解析为USVString格式的promise对象

5.Fetch 与 XMLHttpRequest 的差异

fetch不能监控进度
fetch兼容性

前后端交互三（Fetct基本用法——Request 对象，Headers 对象，Response对象，text()，json()；Fetch 与 XMLHttpRequest 的差异）