随着ES6的推行它的许多新特性受到了广大开发者的好评,比如promise,为什么使用这个promise呢,他具体能帮我们做些啥?

其实从字面意思上来理解promise就是承诺,比如:你命令你的手下本月推销100台产品,他回复没问题百分百完成任务;在这个时候你得到的最终结果就是一个承诺。

还是从案例来理解哈比较清楚;

一、 传统的方法获取多个api异步回调的结果

var user = {
getUserID: function (succCallback, failCallback) {
$.ajax({
type: "POST",
url: "",
data: {},
headers: {},
success: function (response) {
succCallback && succCallback(response);
},
error: function (err) {
failCallback && failCallback(err)
}
}); },
getUserName: function (id, succCallback, failCallback) {
$.ajax({
type: "POST",
url: "",
data: {
id: id
},
headers: {},
success: function (response) {
succCallback && succCallback(response);
},
error: function (err) {
failCallback && failCallback(err)
}
});
},
getUserInfo: function (name, succCallback, failCallback) {
$.ajax({
type: "POST",
url: "",
data: {
name: name
},
headers: {},
success: function (response) {
succCallback && succCallback(response);
},
error: function (err) {
failCallback && failCallback(err)
}
});
},
// 看这个调用是否有点老火
getUserData: function (succCallback, failCallback) {
this.getUserID(isRes => { this.getUserName(isRes, nameRes => { this.getUserInfo(nameRes, response => { succCallback && succCallback(response); }, err => { failCallback && failCallback(err)
})
}, err => { }) }, err => { })
}
} module.exports = user;

二、 使用promise获取多个api异步回调的结果

var user = {
getUserID: function () {
return new Promise((resolve, reject) => {
$.ajax({
type: "POST",
url: "",
data: {},
headers: {},
success: function (response) {
resolve(response);
},
error: function (err) {
reject(err)
}
});
}) },
getUserName: function (id) {
return new Promise((resolve, reject) => {
$.ajax({
type: "POST",
url: "",
data: {
id: id
},
headers: {},
success: function (response) {
resolve(response);
},
error: function (err) {
reject(err)
}
});
}) },
getUserInfo: function (name) {
return new Promise((resolve, reject) => {
$.ajax({
type: "POST",
url: "",
data: {
name: name
},
headers: {},
success: function (response) {
resolve(response);
},
error: function (err) {
reject(err)
}
});
}) },
// 这个调用是否看起来要更清晰一点
getUserData: function () {
return new Promise((resolve, reject) => {
this.getUserID().then(resID => {
return this.getUserName(resID);
}).then(resName => {
return this.getUserInfo(resName);
}).then(res => {
resolve(res);
}).catch(err => {
reject(err);
})
})
},
// 另一种调用
/* getUserData: function () {
return new Promise((resolve, reject) => {
this.getUserID().then(resID => {
this.getUserName(resID).then(resName => {
this.getUserInfo(resName).then(res => {
resolve(res);
}).catch(err => {
reject(err)
})
}).catch(err => {
})
}).catch(err => {
})
})
}
*/
} module.exports = user;

个人理解使用promise 就是:我们不用再自己写callback回调来获取异步操作后的结果了(理解不正确的欢迎指正)

对promise的简单理解的更多相关文章

  1. Promise的简单用法

    众所周知的,Javascript是一种单线程的语言,所有的代码必须按照所谓的“自上而下”的顺序来执行.本特性带来的问题就是,一些将来的.未知的操作,必须异步实现.本文将讨论一个比较常见的异步解决方案— ...

  2. 【原创】分布式之数据库和缓存双写一致性方案解析(三) 前端面试送命题(二)-callback,promise,generator,async-await JS的进阶技巧 前端面试送命题(一)-JS三座大山 Nodejs的运行原理-科普篇 优化设计提高sql类数据库的性能 简单理解token机制

    [原创]分布式之数据库和缓存双写一致性方案解析(三)   正文 博主本来觉得,<分布式之数据库和缓存双写一致性方案解析>,一文已经十分清晰.然而这一两天,有人在微信上私聊我,觉得应该要采用 ...

  3. 关于 Promise 的一些简单理解

    一.ES6 中的 Promise 1.JS 如何解决 异步问题? (1)什么是 同步.异步? 同步指的是 需要等待 前一个处理 完成,才会进行 下一个处理. 异步指的是 不需要等待 前一个处理 完成, ...

  4. 简单理解ECMAScript2015中的箭头函数新特性

    箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也 ...

  5. Q promise API简单翻译

    详细API:https://github.com/kriskowal/q/wiki/API-Reference Q提供了promise的一种实现方式,现在在node中用的已经比较多了.因为没有中文的a ...

  6. generator 到 async 的简单理解。

    generator 到 async 的简单理解.觉得实现方式很有意思. 1. generator generator 函数返回一个遍历器对象 遍历器对象 每次调用next 方法 返回 有着value ...

  7. git的简单理解及基础操作命令

    前端小白一枚,最近开始使用git,于是花了2天看了廖雪峰的git教程(偏实践,对于学习git的基础操作很有帮助哦),也在看<git版本控制管理>这本书(偏理论,内容完善,很不错),针对所学 ...

  8. 简单理解Struts2中拦截器与过滤器的区别及执行顺序

    简单理解Struts2中拦截器与过滤器的区别及执行顺序 当接收到一个httprequest , a) 当外部的httpservletrequest到来时 b) 初始到了servlet容器 传递给一个标 ...

  9. [转]简单理解Socket

    简单理解Socket 转自 http://www.cnblogs.com/dolphinX/p/3460545.html  题外话 前几天和朋友聊天,朋友问我怎么最近不写博客了,一个是因为最近在忙着公 ...

  10. Js 职责链模式 简单理解

    js 职责链模式 的简单理解.大叔的代码太高深了,不好理解. function Handler(s) { this.successor = s || null; this.handle = funct ...

随机推荐

  1. 基于 Agora SDK 实现 Windows 端的一对一视频通话(基于3.6.2版本)

    前提条件 Microsoft Visual Studio 2019 或以上版本 支持 Windows 7 或以上版本的 Windows 设备 有效的 Agora 账户(免费注册) 注:如果你的网络环境 ...

  2. CTF show 信息收集篇

    web1 f12查看网页源代码 web2 打开发现无法f12查看源代码 方法1:禁用js 方法2:打开空白网页提前f12查看源代码然后复制url打开 方法3:Ctrl+u查看 web3 burp抓包 ...

  3. Mybatis # 与 $ 符号区别

    一.区别 1.不同点: 以#{}方式传入参数,预编译时,它会将sql中的#{}替换为?,然后编译sql时,会把值两端加上 双引号.有效防止sql注入,保证数据安全. sql注入:通过把SQL命令插入到 ...

  4. VirtualBox下宿主机和Linux虚拟机共享文件配置方法

    VirtualBox版本-5.2.8 Linux版本-Ubuntu16.04 2020.03.31 一.首先在宿主机上新建一个文件夹,这里命名为共享文件夹(如果读者自行命名记得后文全部替换),存放了一 ...

  5. data.frame数据框操作——R语言

    统计分析中最常见的原始数据形式是类似于数据库表或Excel数据表的形式. 这样形式的数据在R中叫做数据框(data.frame). 数据框类似于一个矩阵,但各列允许有不同类型:数值型向量.因子.字符型 ...

  6. Python中,类的特殊方法与内置函数的关联

    目录 Python类 Python类的设计原则 特殊方法[Special methods] Duck typing 内置函数 English Version The key design princi ...

  7. Python之八大数据类型

    数据类型之整型int 与浮点型 float 整型也就是int型 其实就是整数 如: print(type(10)) 浮点型就是float 其实就是小数 如: print(type(10.0)) # 这 ...

  8. 【AIGC未来的发展方向】面向人工智能的第一步,一文告诉你人工智能是什么以及未来的方向分析

    人工智能的概念 当人们提到"人工智能(AI)"时,很多人会想到机器人和未来世界的科幻场景,但AI的应用远远不止于此.现在,AI已经广泛应用于各种行业和生活领域,为我们带来了无限可能 ...

  9. day20:正则表达式

    单个字符的匹配 findall(正则表达式,字符串) 把符合正则表达式的字符串存在列表中返回 预定义字符集(8) \d 匹配数字 \D 匹配非数字 \w 匹配数字字母下划线 \W 匹配非数字或字母或下 ...

  10. 【Vue项目】尚品汇(六)ShopCar组件开发 购物车模块

    4 购物车 4.1 购物车商品数量控制 Detail\index.vue <div class="cartWrap"> <div class="cont ...