对promise的简单理解
随着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的简单理解的更多相关文章
- Promise的简单用法
众所周知的,Javascript是一种单线程的语言,所有的代码必须按照所谓的“自上而下”的顺序来执行.本特性带来的问题就是,一些将来的.未知的操作,必须异步实现.本文将讨论一个比较常见的异步解决方案— ...
- 【原创】分布式之数据库和缓存双写一致性方案解析(三) 前端面试送命题(二)-callback,promise,generator,async-await JS的进阶技巧 前端面试送命题(一)-JS三座大山 Nodejs的运行原理-科普篇 优化设计提高sql类数据库的性能 简单理解token机制
[原创]分布式之数据库和缓存双写一致性方案解析(三) 正文 博主本来觉得,<分布式之数据库和缓存双写一致性方案解析>,一文已经十分清晰.然而这一两天,有人在微信上私聊我,觉得应该要采用 ...
- 关于 Promise 的一些简单理解
一.ES6 中的 Promise 1.JS 如何解决 异步问题? (1)什么是 同步.异步? 同步指的是 需要等待 前一个处理 完成,才会进行 下一个处理. 异步指的是 不需要等待 前一个处理 完成, ...
- 简单理解ECMAScript2015中的箭头函数新特性
箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也 ...
- Q promise API简单翻译
详细API:https://github.com/kriskowal/q/wiki/API-Reference Q提供了promise的一种实现方式,现在在node中用的已经比较多了.因为没有中文的a ...
- generator 到 async 的简单理解。
generator 到 async 的简单理解.觉得实现方式很有意思. 1. generator generator 函数返回一个遍历器对象 遍历器对象 每次调用next 方法 返回 有着value ...
- git的简单理解及基础操作命令
前端小白一枚,最近开始使用git,于是花了2天看了廖雪峰的git教程(偏实践,对于学习git的基础操作很有帮助哦),也在看<git版本控制管理>这本书(偏理论,内容完善,很不错),针对所学 ...
- 简单理解Struts2中拦截器与过滤器的区别及执行顺序
简单理解Struts2中拦截器与过滤器的区别及执行顺序 当接收到一个httprequest , a) 当外部的httpservletrequest到来时 b) 初始到了servlet容器 传递给一个标 ...
- [转]简单理解Socket
简单理解Socket 转自 http://www.cnblogs.com/dolphinX/p/3460545.html 题外话 前几天和朋友聊天,朋友问我怎么最近不写博客了,一个是因为最近在忙着公 ...
- Js 职责链模式 简单理解
js 职责链模式 的简单理解.大叔的代码太高深了,不好理解. function Handler(s) { this.successor = s || null; this.handle = funct ...
随机推荐
- Spring Boot 入门学习笔记
0x01 前言 大一选修课C++/JAVA二选一,选学了C++.但在后续课程中,发现JAVA的用途很多,所以简单学习了JAVA的语法.同时,也开始了我的Spring Boot 春季|家 (spri ...
- ROS话题通信C++(附launch启动方式)
ROS话题通信C++(附launch启动方式) 创建工作空间 mkdir -p topic_ws/src cd topic_ws catkin_make 设置环境变量 source ./devel/s ...
- 2020中国最好大学排名.py(亲测有效)
import requests from bs4 import BeautifulSoup import bs4 def getHTMLText(url): try: r = requests.get ...
- 使用Electron-packager打包已有的web项目,发布客户端
1.先拉electron代码 git clone https://github.com/electron/electron-quick-start 2.将web项目拷贝到electron-quick- ...
- mixins使用混入引入组件,并可以使用公共函数。组件类同名函数可以替代公共函数。使用$ref获得子元素数据和元素dom节点。使用$parents获得父元素数据。slot插槽的使用
父组件: <template> <div class="box"> <Header > <div slot="left" ...
- 浅读-《深入浅出Nodejs》
原书作者:朴灵 https://book.douban.com/subject/25768396/ 这次算是重读 深入浅出Nodejs,了解到很多之前忽略的细节,收获蛮多,这次顺便将其记录分享,对学习 ...
- SpringBoot打包成exe(别再用exe4j了,使用JDK自带工具)
SpringBoot打包成exe(别再用exe4j了,使用JDK自带工具) 搜到大部分打包exe的文章都是使用exe4j打包 步骤贼多,安装麻烦,打包麻烦 收费软件,公司使用会吃律师函 JDK14以上 ...
- Visual Studio 2022 不支持 .NET Framework 4.5 项目的解决办法
概述 升级到Visual Studio 2022后,打开速度快了很多,开发体验也舒服很多.只是使用过程中遇到了一个比较尴尬的问题:默认Visual Studio 2022 不再支持安装 .NET F ...
- [SrpingBoot]初步搭建springboot应用,报错:Failed to configure a DataSource: 'url' attribute is not specified and no embedd[转载]
1 错误信息 Failed to configure a DataSource: 'url' attribute is not specified and no embedded datasource ...
- mysql 求分组中位数、环比、同比、中位数的环比
说明 中位数.环比.同比概念请自行百度,本文求 字段A中位数.根据字段B分组后字段A中位数.字段A环比.字段A同比.字段A中位数的环比.字段A中位数的同比. 一.表结构如下图 查询条件为 capi ...