Promise学习笔记

tigerZH 发布于2019-08-26 12:14 / 1600人阅读

摘要：异步操作未完成异步操作成功异步操作失败基本用法是一个构造函数，接收一个参数，这个参数是函数，同时这个参数函数要传入两个参数，，分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。如果调用函数，就会调用方法的第一个参数。

Promise对象

Promise 表示一个异步操作的最终结果，与之进行交互的方式主要是 then 方法，该方法注册了两个回调函数，用于接收 promise 的终值或本 promise 不能执行的原因。

Promise 的状态

一个 Promise 的当前状态必须为以下三种状态中的一种：等待态（Pending）、执行态（Fulfilled）和拒绝态（Rejected）。

异步操作未完成（pending）

异步操作成功（fulfilled）

异步操作失败（rejected）

基本用法

Promise是一个构造函数，Promise接收一个参数，这个参数是函数，同时这个参数函数要传入两个参数：resolve，reject，分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。

Promise对象上有then、catch等方法

</>复制代码 
var getAjax = function (url) {
    const promise=new Promise(function(resolve,reject){
    var xhr=new XMLHttpRequest()
    xhr.onreadystatechange=function(){
        if(xhr.readyState!==4){
            return
        }
        if(xhr.status===200){
            resolve("成功时调用resolve函数，并返回一个Promise对象")
        }else{
            reject(new Error(xhr.statusText))
        }
    }
    xhr.open("GET",url)
    xhr.send()
    })
    return promise//返回promise对象
}
getAjax("./ajax.html")
    .then((data)=>{
            console.log("第一个参数: "+ data)//打印resolve函数传递的参数
            return ("第一个then的第一个参数")//返回一个Promise对象并将数据传递给下一个then
        },(data)=>{
            console.log("第二个参数: "+ data)//打印reject函数传递的参数
            return("第一个then的第二个参数")//返回一个Promise对象并将数据传递给下一个then
            }
        )
    .then((data)=>{
        //如果刚开始在getAjax函数中是调用reject函数，第一个then方法才会执行第二个参数，但是后面的then方法只执行第一个参数
            console.log("第一个参数: "+ data)//打印上一个then方法传递的参数
            return ("第二个then的第一个参数")
        },(data)=>{
            console.log("第二个参数: "+ data)
            return ("第二个then的第二个参数")
        }
    )
    .then((data)=>{
            console.log("第一个参数: "+ data)
        },(data)=>{
            console.log("第二个参数: "+ data)
        }
    )

异步操作成功时调用resolve:

异步操作失败时调用reject:

总结：

Promise是一个构造函数，通过new命令创建promise对象。在创建对象的时候传递一个参数，这个参数是一个函数，这个函数有两个参数，这两个参数分别是resolve和reject，它们是两个函数，由 JavaScript 引擎提供，不用自己实现。成功时调用resolve方法，失败时调用reject方法。

在promise对象上有then方法，这个方法可以传递两个参数，这两个参数是函数。

如果调用resolve函数，就会调用then方法的第一个参数。如果调用的是reject函数，就会调用then方法的第二个参数。不管第一个then调用第一个参数还是第二个参数，第一个then方法后面的then方法都会执行第一个参数。

resolve方法和reject方法需要带参数，这个参数会传递给then方法对应的参数。在then方法中返回数据时，可以传递给下一个then方法。

GPU云服务器云服务器学习笔记学习笔记一基础学习笔记深度学习笔记

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108296.html

Promise学习笔记(二):规范

摘要：下一篇大概就是源码方面的学习笔记了龟速学习中这一次我是去看了下规范照例传送门图灵社区规范首先吧个人总结下该用的词解决结婚拒绝婉拒终值值传家宝拒因好人卡等等异常车祸理下概念我们的的就像是一场姻缘对吧解决呢就是结婚成功啦传家宝也如愿的传给下一代下一篇大概就是源码方面的学习笔记了...龟速学习中... 这一次我是去看了下Promises/A+规范照例传送门:图灵社区Promises/A+规...

_Suqin 2019-08-20 11:03 评论0 收藏0
重学前端学习笔记（十七）--Promise里的代码为什么比setTimeout先执行？

摘要：版本以及之前，本身还没有异步执行代码的能力，宿主环境传递给引擎，然后按顺序执行，由宿主发起任务。采纳引擎术语，把宿主发起的任务称为宏观任务，把引擎发起的任务称为微观任务。基本用法示例的回调是一个异步的执行过程。笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的...

pinecone 2019-08-02 16:18 评论0 收藏0
重学前端学习笔记（十七）--Promise里的代码为什么比setTimeout先执行？

摘要：版本以及之前，本身还没有异步执行代码的能力，宿主环境传递给引擎，然后按顺序执行，由宿主发起任务。采纳引擎术语，把宿主发起的任务称为宏观任务，把引擎发起的任务称为微观任务。基本用法示例的回调是一个异步的执行过程。笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的...

zorpan 2019-08-26 13:47 评论0 收藏0
重学前端学习笔记（十七）--Promise里的代码为什么比setTimeout先执行？

摘要：版本以及之前，本身还没有异步执行代码的能力，宿主环境传递给引擎，然后按顺序执行，由宿主发起任务。采纳引擎术语，把宿主发起的任务称为宏观任务，把引擎发起的任务称为微观任务。基本用法示例的回调是一个异步的执行过程。笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的...

xiongzenghui 2019-08-30 10:54 评论0 收藏0