Promise

含义:

Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了Promise对象。

实例化Promise

const p = new Promise();

接收一个参数,这个参数是一个函数,函数有两个参数resolve和reject,异步函数过后,p.then(),里面有两个回调函数,前面那个是成功后的,后面一个是失败时的,如果异步函数中调用resolve则调用第一个函数,否则调用第二个。

const p =new Promise(function (resolve,reject) {
setTimeout(function () {
// let data ='resolve成功';
// resolve(data);
let err='reject失败' reject(err)
},1000)
});
p.then(function (value) { console.log(value); },function (reason) {
console.error(reason);
})

读取文件

const fs=require('fs');

const p=new Promise(function(resolve,reject){

fs.readFile("./chunxiao.mdd",(err,data)=>{
if(err){
reject(err)
}else(
resolve(data)
)
})
})
p.then(function(value){
console.log(value.toString());
},function(reason){
console.log('读取失败');

})

Ajax函数封装

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
const xhr= new XMLHttpRequest();
const p=new Promise((resolve,reject)=>{
xhr.open('get','https://api.apiopen.top/getJoke');
xhr.send();
xhr.onreadystatechange=function(){
if(xhr.readyState ===4){
if(xhr.status>=200&xhr.status<300){
resolve(xhr.response);

}else{
reject(xhr.status);
}
}
}
})
p.then(function(value){
console.log(value)
},function (reason) {
console.log(reason)
})
</script>
</body>
</html>

初试catch

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
const p =new Promise(function (resolve,reject) {
setTimeout(function () {
// let data ='resolve成功';
// resolve(data);
let err='catch失败' reject(err)
},1000)
});
//
p.catch(function (reason) {
console.warn(reason);
})
</script>
</body>
</html>

catch总结:其实可以把catch看作是then的语法糖,里面就少了一个resolve的参数。

Promise.prototype.finally()

finally()方法用于指定不管 Promise 对象最后状态如何,都会执行的操作。该方法是 ES2018 引入标准的。

promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});

上面代码中,不管promise最后的状态,在执行完thencatch指定的回调函数以后,都会执行finally方法指定的回调函数。

实例(体现promise的好处)

通过新建一个 Promise 对象好像并没有看出它怎样 "更加优雅地书写复杂的异步任务"。我们之前遇到的异步任务都是一次异步,如果需要多次调用异步函数呢?例如,如果我想分三次输出字符串,第一次间隔 1 秒,第二次间隔 4 秒,第三次间隔 3 秒:

setTimeout(function () {
console.log("First");
setTimeout(function () {
console.log("Second");
setTimeout(function () {
console.log("Third");
}, 3000);
}, 4000);
}, 1000);

这段程序实现了这个功能,但是它是用 "函数瀑布" 来实现的。可想而知,在一个复杂的程序当中,用 "函数瀑布" 实现的程序无论是维护还是异常处理都是一件特别繁琐的事情,而且会让缩进格式变得非常冗赘。

现在我们用 Promise 来实现同样的功能:

new Promise(function (resolve, reject) {
setTimeout(function () {
console.log("First");
resolve();
}, 1000);
}).then(function () {
return new Promise(function (resolve, reject) {
setTimeout(function () {
console.log("Second");
resolve();
}, 4000);
});
}).then(function () {
setTimeout(function () {
console.log("Third");
}, 3000);
});

Es6-Promise初识的更多相关文章

  1. 通过 ES6 Promise 和 jQuery Deferred 的异同学习 Promise

    Deferred 和 Promise ES6 和 jQuery 都有 Deffered 和 Promise,但是略有不同.不过它们的作用可以简单的用两句话来描述 Deffered 触发 resolve ...

  2. ES6 Promise 接口

    构造函数 new Promise(function(resolve, reject){}); 构造函数接受一个函数(executor)作为参数,该函数在返回 Promise 实例之前被调用.函数的两个 ...

  3. Es6 Promise 用法详解

     Promise是什么??    打印出来看看  console.dir(Promise) 这么一看就明白了,Promise是一个构造函数,自己身上有all.reject.resolve这几个眼熟的方 ...

  4. ES6 Promise 全面总结

    转载:点击查看原文 ES6 Promise对象 ES6中,新增了Promise对象,它主要用于处理异步回调代码,让代码不至于陷入回调嵌套的死路中. @-v-@ 1. Promise本质 Promise ...

  5. ES6 Promise 异步操作

    最近越来越喜欢与大家进行资源分享了,并且及时的同步到自己的园子内,为什么呢? 一.小插曲(气氛搞起) 在上个月末,由于领导的高度重视(haha,这个高度是有多高呢,185就好了),走进了公司骨干员工的 ...

  6. 微信小程序Http高级封装 es6 promise

    公司突然要开放微信小程序,持续蒙蔽的我还不知道小程序是个什么玩意. 于是上网查了一下,就开始着手开发..... 首先开发客户端的东西,都有个共同点,那就是  数据请求! 看了下小程序的请求方式大概和a ...

  7. 解析ES6 Promise

    ES6 Promise 概念之类的,大概读者都应该有所知道,接下来我们直入终点. 先让我们来看看什么是Promise吧,他是一个object,类,arry,function? 首先,学习它的时候应该讲 ...

  8. jquery Promise和ES6 Promise的区别

    1. Deferred对象有resolve和reject方法,可以直接修改状态 jquery用Deferred实现了Promise规范,Deferred与ES6 Promise的最大区别是: Defe ...

  9. ES6 Promise对象then方法链式调用

    then()方法的作用是Promise实例添加解决(fulfillment)和拒绝(rejection)状态的回调函数.then()方法会返回一个新的Promise实例,所以then()方法后面可以继 ...

  10. ES6 Promise(2)

    Promise的兴起,是因为异步方法调用中,往往会出现回调函数一环扣一环的情况.这种情况导致了回调金字塔的出现.不仅代码写起来费劲不美观,而且问题复杂的时候,阅读代码的人也难以理解. db.save( ...

随机推荐

  1. error C2065: “uint8_t”: 未声明的标识符

    转载:https://blog.csdn.net/lys07962000/article/details/12052571 参考: http://blog.csdn.net/chenxin_130/a ...

  2. 【题解】CF1368C Even Picture

    \(\color{purple}{Link}\) \(\text{Solution:}\) 这是一道构造题. 题目要求恰好有\(n\)个点的四周全都是灰色点,所以直接输正方形是不行了. 考虑\(k=1 ...

  3. Rolf Dobelli 《清醒思考的艺术》

    为了避免输光自己靠勤奋积累的财产,罗尔夫·多贝里列了一份系统性思维错误的清单.这一份清单可以和查理·芒格的<人类误判心理学>对照查看. 自本杰明·富兰克林以来,电闪雷鸣没有减少变弱或响声变 ...

  4. 跟我一起学.NetCore之WebApi接口裸奔有风险(Jwt)

    前言 撸码需谨慎,裸奔有风险.经常在一些技术交流群中了解到,还有很多小伙伴的项目中Api接口没有做任何安全机制验证,直接就裸奔了,对于一些临时项目或是个人小项目还好,其余的话,建议小伙伴们酌情考虑都加 ...

  5. golang 进行grpc调用

    参考https://blog.csdn.net/qq_32744005/article/details/105606383 go get google.golang.org/grpc go get - ...

  6. linux的pci驱动模型

    做个笔记 linux通过pcibios_scan_root函数以深度优先的算法搜索整个pci架构,建立一个树形的链表,如下: 之后再调用pci_bus_add_devices函数把所有搜索到的pci_ ...

  7. 手把手搭建一个属于自己的在线 IDE

    背景 这几个月在公司内做一个跨前端项目之间共享组件/区块的工程,主要思路就是在 Bit 的基础上进行开发.Bit 主要目的是实现不同项目 共享 与 同步 组件/区块,大致思路如下: 在 A 项目中通过 ...

  8. ucore操作系统学习笔记(二) ucore lab2物理内存管理分析

    一.lab2物理内存管理介绍 操作系统的一个主要职责是管理硬件资源,并向应用程序提供具有良好抽象的接口来使用这些资源. 而内存作为重要的计算机硬件资源,也必然需要被操作系统统一的管理.最初没有操作系统 ...

  9. python程序整理(2)

    # 写一个函数完成三次登陆功能: # 用户的用户名密码从一个文件register中取出. # register文件包含多个用户名,密码,用户名密码通过|隔开,每个人的用户名密码占用文件中一行. # 完 ...

  10. ansible的copy模块应用(ansible 2.9.5)

    一,copy模块的作用: 复制文件到受控的远程主机 说明:刘宏缔的架构森林是一个专注架构的博客,地址:https://www.cnblogs.com/architectforest 对应的源码可以访问 ...