一、promise函数是干什么的

promise函数是解决异步编程调用代码逻辑编写过于复杂的问题的,当网络请求非常复杂时,就会出现回调地狱,这样如果将这些代码写在一起就会看起来很复杂,且不利于阅读,如果用promise的话就会让代码看起来更加美观优雅

二、Promise三种状态

首先, 当我们开发中有异步操作时, 就可以给异步操作包装一个Promise
异步操作之后会有三种状态

pending:等待状态,比如正在进行网络请求,或者定时器没有到时间。
fulfill:满足状态,当我们主动回调了resolve时,就处于该状态,并且会回调.then()
reject:拒绝状态,当我们主动回调了reject时,就处于该状态,并且会回调.catch()

三、实现方法

 //参数 函数(resolve,reject)
new Promise((resolve, reject) => {
setTimeout(() => {
//请求成功的时候调用resolve
resolve('22222')
//请求失败的时候调用reject
reject('error message')
}, 1000)
}).then((data) => { //请求成功处理函数
console.log(data)
}).catch((err) => { //请求失败处理函数
console.log(err)
})

四、链式调用

new Promise ((resolve,reject) => {
setTimeout(() => {
resolve('aaa')
},1000)
}).then (res => {
//自己处理代码
console.log(res) //对结果进行第一次处理
return new Promise((resole) => {
resole(res + '111')
})
}).then (res => {
//第二层代码
console.log(res)
//对结果进行第二次处理
return Promise.resolve(res + '222') //可以这样简写
}).then(res => {
console.log(res)
})

五、promise all方法

有时候我们需要等待两个或者多个请求都成功返回了再进行下一步操作,promise 的all方法是等所有的异步请求完成之后在进行下一步回调

Promise.all([
new Promise((resolve,reject) => {
$ajax({
url: 'url1',
success: function (data) {
resolve(data)
}
})
}),
new Promise((resolve,reject) => {
$ajax({
url: 'url2',
success: function (data) {
resolve(data)
}
})
})
]).then(results => {
console.log(results) //返回得results是一个数组
})

promise函数的更多相关文章

  1. ES6的promise函数用法讲解

    总结:Promise函数的出现极大的解决了Js中的异步调用代码逻辑编写太过复杂的问题,Promise对象让异步调用函数的流程显得更加的优雅,也更容易编写. 举例: 1. 异步调用: 假设现在我的一个页 ...

  2. 封装原生promise函数

    阿里面试题: 手动封装promise函数 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  3. Promise函数的使用

    最近在做批量打印并监控显示打印进度的功能,用到了很多异步函数,很多异步函数嵌套在回调函数里面,层层嵌套,导致代码可阅读性与可维护性变得十分糟糕,而且由于都是异步执行的函数,无法知道什么时候能回调结束, ...

  4. 为Promise添加finally方法支持,把小程序函数变成promise函数

    // 为Promise添加finally方法支持 Promise.prototype.finally = function (callback) {   let P = this.constructo ...

  5. C++Promise函数

    Promise内部会建立一个shared state是用来放一个相应的类型的值或是一个异常,并可被future object 取其数据当线程结果 promise是在形成成果后才将结果放进shared ...

  6. 【学习笔记】浅析Promise函数

    一.Promise是什么? 在JavaScript中,所有的代码都是单线程执行,所以javaScript的所有网络操作(“GET”/"POST"/"PUT"/& ...

  7. 阿里前端测试题--关于ES6中Promise函数的理解与应用

    今天做了阿里前端的笔试题目,原题目是这样的 //实现mergePromise函数,把传进去的数组顺序先后执行,//并且把返回的数据先后放到数组data中 const timeout = ms => ...

  8. 如何手动封装Promise函数

    第一步:Promise构造函数接受一个函数作为参数,该函数的两个参数分别是:resolve和reject; function Promise(task) { // 缓存this let that = ...

  9. 理解Promise函数中的resolve和reject

    看了promise的用法,一直不明白里面的resolve和reject的用法: 运行了这两段代码之后彻底理解了promise的用法: var p = new Promise(function (res ...

随机推荐

  1. 初步学习jQuery之事件

    事件 页面加载 在DOM中提供了load事件用于页面加载完毕之后执行机制,jQuery提供了ready()方法实现相似的功能,但是存在以下的区别.1.DOM中的load事件没有任何的简写形式,但是在j ...

  2. zhanghao

    账号:wx8b9ddd1c943ce95f 密码:fa72de9a1721849edc7f41f8a81019e5

  3. xxxxxxxxxxxxxxxxxxx

    <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...

  4. eureka注册中心wro.css wro.js 404

    注册中心和配置中心放在一个module里面,如果不配置配种中心的访问前缀,会被config拦截.所以改动如下: package com.cloud.stagging.lhcloudeureka; im ...

  5. Python分析《武林外传》

    我一向比较喜欢看武侠电影.小说,但是06年武林外传开播的时候并没有追剧,简单扫几眼之后发现他们都不会那种飞来飞去的打,一点也不刺激.09年在南京培训的时候,日子简单无聊透顶,大好的周末不能出门,只能窝 ...

  6. Vagrant 手册之同步目录 - 基本用法

    原文地址 - 概述 原文地址 - 基本用法 同步目录 Synced folder 支持在宿主机和客户机之间共享目录,从而允许你在宿主机的项目文件上工作,但是可以在客户机上编译并运行. 默认情况下,Va ...

  7. 洛谷T89643 escape

    题目描述 题目链接:https://www.luogu.org/problem/T89643 由于 Kiana 实在是太忙了,所以今天的题里面没有 Kiana. 某一天学校里有 n 节课,出题人希望逃 ...

  8. poj3669 Meteor Shower (宽度优先搜索)

    Description - 题目描述 Bessie听说有场史无前例的流星雨即将来临:有谶言:陨星将落,徒留灰烬.为保生机,她誓将找寻安全之所(永避星坠之地).目前她正在平面坐标系的原点放牧,打算在群星 ...

  9. 校内模拟赛T5:连续的“包含”子串长度( nekameleoni?) —— 线段树单点修改,区间查询 + 尺取法合并

    nekameleoni 区间查询和修改 给定N,K,M(N个整数序列,范围1~K,M次查询或修改) 如果是修改,则输入三个数,第一个数为1代表修改,第二个数为将N个数中第i个数做修改,第三个数为修改成 ...

  10. 腾达Tenda W311MA无线网卡Linux下驱动安装

    菜鸟看这里https://help.ubuntu.com/community/WifiD ... enda_W311M 最近也买了颗Tenda W311M网卡,简单说一下驱动的安装和hostapd做S ...