当了这么久码农到今天没事才开始去深究 Promise 这个对象

  • 什么是 Promise, Promise 有什么用?

  在写代码的时候多多少少都有遇见过地狱式的回调 代码看起来没问题就是有点乱,Promise 这个东西就是为了解决回调嵌套而生的 Promise 是异步编程的一种解决方案:从语法上讲,promise是一个对象,从它可以获取异步操作的消息;从本意上讲,它是承诺,承诺它过一段时间会给你一个结果。promise有三种状态:pending(等待态),fulfiled(成功态),rejected(失败态);状态一旦改变,就不会再变。创造promise实例后,它会立即执行。

  • 知道 promise  ,那应该怎样用呢?

  举个最简单的例子利用 JQuery 返回一个 Promise 对象,实现 .then 对 ajax 进行调用

   function getData(path,type='get',dataType='json'){
return $.ajax({
url:path,
type:type,
dataType:dataType
})
}

 

   那如果我用不了 JQuery 怎么办, 我们可以直接用原生 Promise 来实现

 function getData(url) {
return new Promise(function (resolve, reject) {
var XHR =new XMLHttpRequest() ;
XHR.onreadystatechange = function () {
if (XHR.readyState == 4) {
if ((XHR.status >= 200 && XHR.status < 300) || XHR.status == 304) {
try {
var response = JSON.parse(XHR.responseText);
resolve(response);
} catch (e) {
reject(e);
}
} else {
reject(new Error("Request was unsuccessful: " + XHR.statusText));
}
}
}
XHR.open('GET', url , true);
XHR.send(null);
})
}
  • 最后我们来说一下 Promise 正常场景的两种使用方法

    1. 回调后调用函数,第一个函数报错后面的函数就可以不用执行。

       getData('./data.json',).then((data)=>{
console.log(data)
getData('./data1.json',)
}).then(data=>{
console.log(data)
getData('./data2.json',)
}).then(data=>{
console.log(data)
}).catch(err=>{
console.log(err)
})

    

    2. 回调后调用函数,第一个函数错误后后面的函数还要继续执行。

          getData('./data.json',).then((data)=>{
console.log(data)
getData('./data1.json',)
}).catch(err=>{
console.log(err)
getData('./data1.json',)
}).then(data=>{
console.log(data)
getData('./data2.json',)
}).then(data=>{
console.log(data)
})

  总的来说 Promise 有什么用呢?代码量没减少,写起来还复杂。 你可以这样认为 Promise  没啥用就是让你的代码看起来不那么别扭,没有了回调地狱让你的代码可读写更强,看起来心情更好,心情好代码就打的快,代码打的快就有时间去学习,有时间学习就可以跳槽,就加工资。简单说 Promise 就是一个花瓶。中看!!

Promise 学习心得的更多相关文章

  1. PWA学习心得

    PWA学习心得 一.什么是PWA Progressive  Web  App , (渐进式增强 WEB 应用) 简称 PWA ,是提升WebApp的体验的一种新方法,能给用户原生应用的体验. PWA ...

  2. 我的MYSQL学习心得(一) 简单语法

    我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(五) 运 ...

  3. 我的MYSQL学习心得(二) 数据类型宽度

    我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(五) 运 ...

  4. 我的MYSQL学习心得(三) 查看字段长度

    我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(五) 运 ...

  5. 我的MYSQL学习心得(四) 数据类型

    我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(五) 运 ...

  6. 我的MYSQL学习心得(五) 运算符

    我的MYSQL学习心得(五) 运算符 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据 ...

  7. 我的MYSQL学习心得(六) 函数

    我的MYSQL学习心得(六) 函数 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类 ...

  8. 我的MYSQL学习心得(七) 查询

    我的MYSQL学习心得(七) 查询 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类 ...

  9. 我的MYSQL学习心得(八) 插入 更新 删除

    我的MYSQL学习心得(八) 插入 更新 删除 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得( ...

随机推荐

  1. git简单使用-GitHub

    本文描述window下如何使用git工具,操作GitHub远程代码库 一,准备工作: 1,安装git工具,一路默认next安装即可,下载地址 2,注册账号或者创建厂库(已有忽略) 注册账号后,创建仓库 ...

  2. django基础知识之模板继承:

    模板继承 模板继承可以减少页面内容的重复定义,实现页面内容的重用 典型应用:网站的头部.尾部是一样的,这些内容可以定义在父模板中,子模板不需要重复定义 block标签:在父模板中预留区域,在子模板中填 ...

  3. [AI开发]目标跟踪之计数

    基于视频结构化的应用中,目标在经过跟踪算法后,会得到一个唯一标识和它对应的运动轨迹,利用这两个数据我们可以做一些后续工作:测速(交通类应用场景).计数(交通类应用场景.安防类应用场景)以及行为检测(交 ...

  4. kuangbin专题专题四 Frogger POJ - 2253

    题目链接:https://vjudge.net/problem/POJ-2253 思路: 从一号到二号石头的所有路线中,每条路线中都个子选出该路线中两点通路的最长距离,并在这些选出的最长距离选出最短路 ...

  5. C语言 实验设备管理系统

    实验设备信息管理系统 简单的思路,简单的算法 题目简述:实验室设备信息用文件存储,提供文件的输入输出操作:要能够完成设备的录入和修改,需要提供设备添加和修改操作:实现对设备进行分类统计,需要提供排序操 ...

  6. MFC开发--截图工具

    近期学习了MFC的相关知识,MFC(Microsoft Foundation Classes)是微软公司提供的一个类库,可以这样简单理解,就是对于Win32的封装(MFC对windows API函数的 ...

  7. 如何利用Azure Automation以及Tag自动开关VM

    这是本博客第一篇技术相关的小贴士,在这里我不会详细介绍所涉及的技术组件的具体使用细节,因为我相信这些大家都可以通过官方文档了解到.如果你是一个看了官方文档依然一脸茫然的IT小白,个人建议是先从基础重新 ...

  8. DAX 第六篇:统计函数

    统计函数用于创建聚合,对数据进行统计分析.在使用统计函数时,必须考虑到数据模型,表之间关系,数据重复等因素,一般都会搭配过滤函数实现数据的提取和分析. 统计量一般是:均值.求和.计数.最大值.最小值. ...

  9. python基础之元祖、嵌套,for循环、 enumerate、range的试用案例

    元祖又叫做只读列表,可循环查询.可切片,元祖里的直接元素不能更改,但是若里面有嵌套的列表,则可以修改列表里的元素 tu = (1,2,3,'sun',[3,4,5,'cat']) tu[4][3] = ...

  10. 初始SpringMVC 完整版

    初始SpringMVC 1.SpringMVC 也叫Spring Web mvc,属于表现层的框架.Spring MVC是Spring框架的一部分,是在Spring3.0后发布的. 2.Java EE ...