function status(response) { if (response.status >= 200 && response.status < 300) { return Promise.resolve(response) } else { return Promise.reject(new Error(response.statusText)) } } function json(response) { return response.json() } fetch('users.json') .then(status) .then(json) .then(function(data) { console.log('Request succeeded with JSON response', data); }).catch(function(error) { console.log('Request failed', error); });
我们用 status 函数来检查 response.status 并返回 Promise.resolve() 或 Promise.reject() 的结果，这个结果也是一个 Promise。我们的fetch() 调用链条中，首先如果fetch()执行结果是 resolve，那么，接着会调用 json() 方法，这个方法返回的也是一个 Promise，这样我们就得到一个分析后的JSON对象。如果分析失败，将会执行reject函数和catch语句。
你会发现，在fetch请求中，我们可以共享一些业务逻辑，使得代码易于维护，可读性、可测试性更高。
用fetch执行表单数据提交
在WEB应用中，提交表单是非常常见的操作，用fetch来提交表单数据也是非常简洁。
fetch里提供了 method 和 body 参数选项。
fetch(url, { method: 'post', headers: { "Content-type": "application/x-www-form-urlencoded; charset=UTF-8" }, body: 'foo=bar&lorem=ipsum' }) .then(json) .then(function (data) { console.log('Request succeeded with JSON response', data); }) .catch(function (error) { console.log('Request failed', error); });
在Fetch请求里发送用户身份凭证信息
如果你想在fetch请求里附带cookies之类的凭证信息，可以将 credentials 参数设置成 “include” 值。
fetch(url, { credentials: 'include' })
显而易见，fetch API相比起传统的 XMLHttpRequest (XHR) 要简单的多，相比起jQuery里提供ajax API也丝毫不逊色。