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. SQL数据库删除和还原的时候提示 被占用 记录一下

    设置离线 1)ALTER DATABASE [datebase] SET OFFLINE WITH ROLLBACK IMMEDIATE设置在线 2)ALTER DATABASE [datebase] ...

  2. MQTT消息队列压力测试

    环境准备: jmeter插件下载:mqttxmeter1.0.1jarwithdependencies.jar 把MQTT插件放在 %JMeter_Home%/lib/ext下.重启jmeter. M ...

  3. vscode编写python,引用本地py文件出现红色波浪线

    前言 引用本地py文件出现红色波浪线,如下图: 原因 经过查询得知,vscode中的python插件默认使用的是pylint来做代码检查,因此需要对pylint做一些配置 解决方案 在setting. ...

  4. python接口测试之日志功能

    之前在简书中看了一篇关于日志功能的文档,供大家参考:https://www.jianshu.com/p/62f7b49b41e7 Python通过logging模块提供日志功能,所以直接导入即可 im ...

  5. spring-boot-route(十七)使用aop记录操作日志

    在上一章内容中--使用logback管理日志,我们详细讲述了如何将日志生成文件进行存储.但是在实际开发中,使用文件存储日志用来快速查询问题并不是最方便的,一个优秀系统除了日志文件还需要将操作日志进行持 ...

  6. 三色二叉树 ---伪树形dp

    题目描述 一棵二叉树可以按照如下规则表示成一个由0.1.2组成的字符序列,我们称之为"二叉树序列S": 0 该树没有子节点 1S1 该树有一个子节点,S1为其二叉树序列 1S1S2 ...

  7. docker启动服务---------------rabbitmq

    1.进入docker hub镜像仓库地址:https://hub.docker.com/ 2.搜索rabbitMq,进入官方的镜像,可以看到以下几种类型的镜像:我们选择带有"mangemen ...

  8. docker 启动redis/nginx

    1.docker 启动redis   # redis docker run -itd --name redis-test -p 16379:6379 redis   2.docker 启动nginx ...

  9. linux(centos8):用tr替换或删除字符

    一,tr命令的用途 tr命令可以替换或删除文件中的字符 它从标准输入设备读取数据, 处理完成将结果输出到标准输出设备 说明:刘宏缔的架构森林是一个专注架构的博客,地址:https://www.cnbl ...

  10. 第六章 类(Class) 和对象(Object)

    一.笔记导图 二.实例代码: public class PrintCarStatus{ public static void main(String[] args){ int speed; Strin ...