### Fetch FetchAPI提供了一个获取资源的接口（包括跨域请求），用于访问和操纵HTTP管道的部分，例如请求和响应。它还提供了一个全局[`fetch()`](https://developer.mozilla.org/zh-CN/docs/Web/API/GlobalFetch/fetch "此页面仍未被本地化, 期待您的翻译!")方法，该方法提供了一种简单，合理的方式来跨网络异步获取资源。Fetch API 是基于 Promise 设计，使用了Promises 来处理结果/回调。`fetch()` 必须接受一个参数——资源的路径。无论请求成功与否，它都返回一个 Promise 对象，resolve 对应请求的 [`Response`](https://developer.mozilla.org/zh-CN/docs/Web/API/Response "Fetch API 的 Response 接口呈现了对一次请求的响应数据。")。你也可以传一个可选的第二个参数`init`（参见 [`Request`](https://developer.mozilla.org/zh-CN/docs/Web/API/Request "你可以使用  Request.Request() ?构造函数创建一个Request 对象，但是你可能会遇到一个 Request 对象作为其它 API 的操作被返回，比如一个 service worker的FetchEvent.request。")）。 **`Fetch请求`** ``` // fetch('url', '<init对象 可选>') // **支持请求参数** fetch('https://www.jianshu.com/users/recommended?seen\_ids=&count=5&only\_unfollowed=true', {test: '测试'}) .then(function(response) { // 返回一个 JSON Promise，Promise 的解析 resolve 结果是将文本体解析为`JSON` return response.json() }) .then(function(data) { // js格式的json对象 console.log(data) }) // **指定发送`get`方式** const fetchRequest = async () => { let response = await fetch("https://www.jianshu.com/users/recommended?seen\_ids=&count=5&only\_unfollowed=true", { method: 'get', }) let data = await response.json() // js格式的json对象 console.info(data) } fetchRequest() // **上传JSON数据** fetch(url, { method: 'POST', body: JSON.stringify(data), headers: new Headers({ 'Content-Type': 'application/json' }) }).then(res => res.json()) .catch(error => console.error('Error:', error)) .then(response => console.log('Success:', response)); // **上传文件** var formData = new FormData(); var fileField = document.querySelector("input[type='file']"); formData.append('username', '测试'); formData.append('avatar', fileField.files[0]); fetch('https://example.com/profile/avatar', { method: 'PUT', body: formData }) .then(response => response.json()) .catch(error => console.error('Error:', error)) .then(response => console.log('Success:', response)); ```