标签：
Ajax，2005年诞生的技术，至今已持续了 10 年。它是一种在客户端创建一个异步请求的技术，本质上它不算创新，是一组技术的组合。它的核心对象是 XMLHttpRequest。
简单回顾下历史
使用步骤大概如下
var xhr = new XMLHttpRequest();
xhr.open(‘GET‘, url);
xhr.onload = function() {
// To do with xhr.response
};
xhr.onerror = function() {
// Handling errors
};
xhr.send();
以上可以看出，XHR 使用 onXXX 处理，典型的 "事件模式"。
Fetch 目前还不是 W3C 规范，由 whatag 负责出品。与 Ajax 不同的是，它的 API 不是事件机制，而采用了目前流行的 Promise 方式处理。我们知道 Promise 是已经正式发布的 ES6 的内容之一。
fetch(‘doAct.action‘).then(function(res) {
if (res.ok) {
res.text().then(function(obj) {
// Get the plain text
})
}
}, function(ex) {
console.log(ex)
})
以上 fetch 函数是全局的，目前最新的Firefox，Chrome，Opera 都已支持，详见
以上是一个最简单的请求，只要传一个参数 url 过去，默认为 get 请求，获取纯文本，fetch 第二个参数可以进行很多配置，比如 POST 请求
fetch("doAct.action", {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded"
},
body: "keyword=荣耀7i&enc=utf-8&pvid=0v3w1kii.bf1ela"
}).then(function(res) {
if (res.ok) {
// To do with res
} else if (res.status == 401) {
// To do with res
}
}, function(e) {
// Handling errors
});
如果返回的是 JSON， 如下
fetch(‘doAct.action‘).then(function(res) {
if (res.ok) {
res.json().then(function(obj) {
// Get the JSON
})
}
}, function(ex) {
console.log(ex)
})
res 实际上该规范定义的 Response 对象，它有如下方法
相关：
https://developer.mozilla.org/zh-CN/docs/Web/API/GlobalFetch/fetch
https://fetch.spec.whatwg.org
https://hacks.mozilla.org/2015/03/this-api-is-so-fetching
标签：
原文地址：http://www.cnblogs.com/snandy/p/5076512.html
