ES6 用Promise对象实现的 Ajax 操作
下面是一个用Promise
对象实现的 Ajax 操作的例子。
const getJSON = function(url) {
const promise = new Promise(function(resolve, reject){
const handler = function() {
if (this.readyState !== 4) {
return;
}
if (this.status === 200) {
resolve(this.response);
} else {
reject(new Error(this.statusText));
}
};
const client = new XMLHttpRequest();
client.open("GET", url);
client.onreadystatechange = handler;
client.responseType = "json";
client.setRequestHeader("Accept", "application/json");
client.send(); }); return promise;
}; getJSON("/posts.json").then(function(json) {
console.log('Contents: ' + json);
}, function(error) {
console.error('出错了', error);
});
上面代码中,getJSON
是对 XMLHttpRequest 对象的封装,用于发出一个针对 JSON 数据的 HTTP 请求,并且返回一个Promise
对象。需要注意的是,在getJSON
内部,resolve
函数和reject
函数调用时,都带有参数。
ES6 用Promise对象实现的 Ajax 操作的更多相关文章
- 用Promise对象实现的 Ajax 操作
- ES6的Promise对象
http://es6.ruanyifeng.com/#docs/promise Promise 对象 Promise 的含义 基本用法 Promise.prototype.then() Promise ...
- ES6的promise对象研究
ES6的promise对象研究 什么叫promise? Promise对象可以理解为一次执行的异步操作,使用promise对象之后可以使用一种链式调用的方式来组织代码:让代码更加的直观. 那我们为什么 ...
- 教你如何使用ES6的Promise对象
教你如何使用ES6的Promise对象 Promise对象,ES6新增的一个全新特性,这个是 ES6中非常重要的一个对象 Promise的设计初衷 首先,我们先一起了解一下,为什么要设计出这么一个玩意 ...
- ES6 - promise对象
Promise的设计初衷 我们使用ajax请求数据,得到数据后再对数据进行操作,可是有时候,对得到的数据进行操作的过程中,可能又要用到ajax请求,这时,我们的代码就变成了这样: $.ajax({ s ...
- ES6中Promise对象个人理解
Promise是ES6原生提供的一个用来传递异步消息的对象.它减少了传统ajax金字塔回调,可以将异步操作以同步操作的流程表达出来使得代码维护和可读性方面好很多. Promise的状态: 既然是用来传 ...
- 谈谈 ES6 的 Promise 对象
https://segmentfault.com/a/1190000002928371 前言 开篇首先设想一个日常开发常常会遇到的需求:在多个接口异步请求数据,然后利用这些数据来进行一系列的操作.一般 ...
- 前端知识点回顾之重点篇——ES6的Promise对象
Promise Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大. 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异 ...
- ES6的promise对象应该这样用
ES6修补了一位Js修真者诸多的遗憾. 曾几何时,我这个小白从js非阻塞特性的坑中爬出来,当我经历了一些回调丑陋的写法和优化的尝试之后,我深深觉得js对于多线程阻塞式的开发语言而言,可能有着其太明显的 ...
随机推荐
- JS设计模式(2)策略模式
什么是策略模式? 定义:根据不同参数可以命中不同的策略 主要解决:在有多种算法相似的情况下,使用 if...else 所带来的复杂和难以维护. 何时使用:有许多种情况,而区分它们的只是他们直接的行为. ...
- Bootstrap3基础 table-striped 表格实现隔行换色(浅灰色与白色交替)
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- express中session的使用
一.Session 简单介绍 session 是另一种记录客户状态的机制,不同的是 Cookie 保存在客户端浏览器中,而 session 保存在服务器上.Session 的用途:session 运行 ...
- parquet 简介
原文 Parquet 列式存储格式 面向分析型业务的列式存储格式 由 Twitter 和 Cloudera 合作开发,2015 年 5 月从 Apache 的孵化器里毕业成为 Apache 顶级项目 ...
- Lintcode97-Maximum Depth of Binary Tree-Easy
97. Maximum Depth of Binary Tree Given a binary tree, find its maximum depth. The maximum depth is t ...
- 基本设置_common_setting
comment(备注) ID(请勿修改) Param(参数) 说明与格式 积分物品ID设置 1 60000 积分属性虚拟货币,存储在Auth库account表TokenAmount字段. 这里设置积分 ...
- R apply函数 三维 array
参考自:https://www.cnblogs.com/nanhao/p/6674063.html 首先,生成三维数组,注意该三维矩阵为 2*3*4的维度: x=array(1:24,c(2,3,4) ...
- Java操作MongoDB:连接&增&删&改&查
1.连接 ①方式一 MongoClientOptions.Builder builder = MongoClientOptions.builder(); //可以通过builder做各种详细配置 Mo ...
- form表单的提交方式
开发中表单提交是很常见的,表单的提交方式也多种方式. 1.使用submit按钮提交表单 <input type="submit"/> <!DOCTYPE htm ...
- 页面系统,浏览器检测- 网页基础模块(JavaScript)
// 浏览器检测,获取,弹出框提醒IE 返回浏览器详情 function GetbrowserSys() { var BrowserMatch = { init: function() { this. ...