首页
学习
活动
专区
圈层
工具
发布

【javascript】异步编年史,从“纯回调”到Promise

NO,请看下面: 对于一些比较常见的异步场景回调也没办法用足够简洁优雅的方式去处理: 这些场景包括但不限于:链式,门和竞态 链式 首先你肯定知道用回调处理大量存在链式的异步场景的画风是怎样的 例如这样:...Rejected 而且Promise成功的时候(调用resolve), resolve返回的参数可以被第一个回调接收到, 如上面的value参数 而当Promise失败的时候(调用reject), reject...返回的错误会被传递给第二个回调, 如上面的error 【辩解】: 你可能会说:哎呀我们绕了一圈不是又回到了回调了吗?...回调中的报错被吞掉 要说明一点的是Promise中的then方法中的error回调被调用的时机有两种情况: 1....链式 我们上面说了, 纯回调的一大痛点就是“金字塔回调地狱”, 这种“嵌套风格”的代码丑陋难懂,但Promise就可以把这种“嵌套”风格的代码改装成我们喜闻乐见的“链式”风格 因为then函数是可以链式调用的

1.3K80

ES6中的Promise对象作用

除了善用设计模式提高代码优雅程度外,es6原生提供的Promise对象也为异步函数回调提供的比较优雅的解决方案。它把原来的嵌套回调变成了级联调用,很好的解决回调地狱的问题。...Promise实例具有then()方法,也就是说then()方法是定义在原型对象Promise.prototype上的,then方法的第一个参数是resolved状态的回调函数,第二个参数(可选)是rejected...另外需要注意的是,then方法返回的是一个新的Promise实例,所以可以使用链式写法,即在then方法后面再调另一个then方法。...then方法指定的回调函数,返回的是一个Promise对象。..., error); 6}); 上面代码中,getJSON方法返回一个 Promise 对象,如果该对象状态变为resolved,则会调用then方法指定的回调函数;如果异步操作抛出错误,状态就会变为rejected

97220
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    使用 promise 重构 Android 异步代码

    ,选择等待这个承诺兑现(通过 Promise 的 then 方法的回调)。...不易于维护 使用 Promise重构后: 可以看到有以下变化: 消除了异步回调接口,链式调用让逻辑更连贯更清晰了 通过 Promise 包装了网络请求调用,统一返回 Promise 指定了 Promise...使用Promise重构后: 第一个Promise处理长链接Push监听 ,设置5s超时,超时异常发生回调except方法,判断throwable 类型,如果为PromiseTimeoutException...Promise.any():接受任意个Promise对象,并发执行异步任务。等待其中一个成功即为成功,全部任务失败则进入错误状态,输出错误列表。...避免过长的链式调用:虽然Promise可以通过链式调用来避免回调地狱,但是如果Promise的链过长,代码的可读性和维护性也会变差。 2.

    47120

    深入理解nodejs中的异步编程

    于是浏览器实现了一组API,可以让javascript以回调的方式来异步响应页面的请求事件。 更进一步,nodejs引入了非阻塞的 I/O ,从而将异步的概念扩展到了文件访问、网络调用等。...javascript中的回调 javascript中的回调是异步编程的一个非常典型的例子: document.getElementById('button').addEventListener('click...上篇文章我们讲到的setTimeout和setInterval实际上都是异步的回调函数。 回调函数的错误处理 在nodejs中怎么处理回调的错误信息呢?...nodejs采用了一个非常巧妙的办法,在nodejs中,任何回调函数中的第一个参数为错误对象,我们可以通过判断这个错误对象的存在与否,来进行相应的错误处理。...但是遗憾的是,如果我们需要依赖回调函数的返回值来进行下一步的操作的时候,就会陷入这个回调地狱。 叫回调地狱有点夸张了,但是也是从一方面反映了回调函数所存在的问题。

    1.5K21

    深入理解nodejs中的异步编程

    于是浏览器实现了一组API,可以让javascript以回调的方式来异步响应页面的请求事件。 更进一步,nodejs引入了非阻塞的 I/O ,从而将异步的概念扩展到了文件访问、网络调用等。...javascript中的回调 javascript中的回调是异步编程的一个非常典型的例子: document.getElementById('button').addEventListener('click...上篇文章我们讲到的setTimeout和setInterval实际上都是异步的回调函数。 回调函数的错误处理 在nodejs中怎么处理回调的错误信息呢?...nodejs采用了一个非常巧妙的办法,在nodejs中,任何回调函数中的第一个参数为错误对象,我们可以通过判断这个错误对象的存在与否,来进行相应的错误处理。...但是遗憾的是,如果我们需要依赖回调函数的返回值来进行下一步的操作的时候,就会陷入这个回调地狱。 叫回调地狱有点夸张了,但是也是从一方面反映了回调函数所存在的问题。

    1.6K30

    重学JavaScript Promise API

    在这篇教程中,我们将掌握如何在JavaScript中创建并使用Promise。我们将了解Promise链式调用、错误处理以及最近添加到语言中的一些Promise静态方法。 什么是Promise?...它就像操作结果的代理。 回调函数 在拥有JavaScript Promise之前,处理异步操作最优雅的方式是使用回调。当异步操作的结果就绪时,回调就是一个运行的函数。...goes here }); 首先,我们使用Promise构造函数实例化一个新的Promise对象,并传递给它一个回调函数。...(注意,我们在这里使用的是箭头函数)在回调中,我们向 https://icanhazdadjoke.com/ 创建了一个 Ajax 请求,该请求以 JSON 格式返回一个随机的笑话。...then方法 当我们实例化一个Promise对象时,我们将得到一个未来可用数据的代理。在我们的例子中,我们期待从远程服务返回一些数据。那么,我们如何知道数据何时可用呢?

    40820

    一个合格的中级前端工程师要掌握的JavaScript 技巧

    值得一提的是,map 的第二个参数为第一个参数回调中的 this 指向,如果第一个参数为箭头函数,那设置第二个 this 会因为箭头函数的词法绑定而失效 另外就是对稀疏数组的处理,通过 hasOwnProperty...ES5 实现数组的 some 方法 ? 执行 some 方法的数组如果是一个空数组,最终始终会返回 false,而另一个数组的 every 方法中的数组如果是一个空数组,会始终返回 true 7....ES6 的 class 内部是基于寄生组合式继承,它是目前最理想的继承方式,通过 Object.create 方法创造一个空对象,并将这个空对象继承 Object.create 方法的参数,再让子类(subType...)的原型对象等于这个空对象,就可以实现子类实例的原型等于这个空对象,而这个空对象的原型又等于父类原型对象(superType.prototype)的继承关系 而 Object.create 支持第二个参数...promisify 函数是将回调函数变为 promise 的辅助函数,适合 error-first 风格(nodejs)的回调函数,原理是给 error-first 风格的回调无论成功或者失败,在执行完毕后都会执行最后一个回调函数

    1.1K30

    深入浅出Promise,循序渐进掌握JavaScript异步编程

    该新的 Promise 实例在数组中的第一个 Promise 实例变为fulfilled或rejected状态后,即变为对应的状态,并将第一个 Promise 实例的结果(或错误信息)传递给回调函数。...每个then方法中返回一个新的 Promise 对象,用于传递上一个操作的结果给下一个操作。...在和reject函数被调用时,会根据状态的变化,将对应的回调函数添加到任务队列中,并在适当的时候执行。链式调用:通过then方法的链式调用,可以将多个异步操作按顺序组织起来。...当一个 Promise 对象的状态变为fulfilled时,会执行当前then方法的回调函数,并将回调函数的返回值作为下一个then方法的参数。...总的来说, Promise 的源码实现原理是通过构造函数实例化 Promise 对象,在对象中管理状态、回调函数和异步操作。

    67510

    回调地狱解决方案之Promise

    我的理解: Promise是回调函数可以规范的链式调用 Promise原理与讲解 原理 Promise的三种状态 pending:进行中 fulfilled :执行成功 rejected :执行失败...对于这个空对象我们如果想继续做一些什么,需要进行处理,可以用非空Promise对这个空的进行赋值覆盖,然后继续then的链式调用。...几个常用api Promise.resolve resolve方法用来将一个非Promise对象转化为Promise对象 转换的对象是一个常量或者不具备状态的语句,转换后的对象自动处于resolve状态...all中的两个promise,第一个是统计时间内该手机号发送验证码数量;第二个是统计时间内该ip发送验证码的数量。...状态不可逆性 resolve函数和reject函数只是传递异步结果 then进行层级调用的时候,每次的返回值都一个空promise对象,如果想继续使用,赋值替换掉空promise对象,但是返回的时候return

    86920

    【JS】302- 回调地狱解决方案之Promise

    我的理解: Promise是回调函数可以规范的链式调用 Promise原理与讲解 原理 Promise的三种状态 pending:进行中 fulfilled :执行成功 rejected :执行失败...对于这个空对象我们如果想继续做一些什么,需要进行处理,可以用非空Promise对这个空的进行赋值覆盖,然后继续then的链式调用。...几个常用api Promise.resolve resolve方法用来将一个非Promise对象转化为Promise对象 转换的对象是一个常量或者不具备状态的语句,转换后的对象自动处于resolve状态...all中的两个promise,第一个是统计时间内该手机号发送验证码数量;第二个是统计时间内该ip发送验证码的数量。...状态不可逆性 resolve函数和reject函数只是传递异步结果 then进行层级调用的时候,每次的返回值都一个空promise对象,如果想继续使用,赋值替换掉空promise对象,但是返回的时候return

    1.5K30

    promise & axios & async_await 关于 Promise

    前面说过,then方法的第一个参数是resolved状态的回调函数,第二个参数是rejected状态的回调函数,它们都是可选的 (2).catch:异常处理; (3).finally:不管 Promise...第一个是resolved状态的回调函数,第二个是rejected状态的回调函数。中间逗号衔接,这两个函数都是可选非必填的。它们都接受Promise对象传出的值作为参数。...又因为每一个Promise实例都有.then方法,因此可以采用链式写法,即then方法后面再调用另一个then方法。 采用链式的then,可以有序调用回调函数。...后一个 then会根据前一个then之后返回的Promise对象的状态(成功/失败)去决定走后一个then的成功回调还是失败的回调 const promise = new Promise((resolve...所以也继承一些个方法比如.then 比如axios我们通过then也可以用then的链式调用代替回调地狱注意return出去才是一个prominse对象才可以继续使用.then created(){

    1.7K20

    JS高阶(一)Promise

    指定回调函数的方式更加灵活 旧:必须在启动异步任务前指定 promise:启动异步任务=>返回promise对象=>给promise对象绑定回调函数(甚至可以在异步任务结束后指定多个) 支持链式调用,...解决回调地狱问题 回调地狱:回调函数嵌套调用,外部回调函数异步执行的结果是嵌套回调执行的条件; 回调地域缺点:不便于阅读,不便于异常处理; 解决方案:promise链式调用; 5.2.1 对象状态改变...对象 //如果传入的对象为 非promise对象 则返回的是一个 成功的promise对象 //如果传入的对象 非promise对象 则参数的结果决定了 resolve的结果 let p =...then() 返回一个新的 promise,可以展开 then() 的链式调用; 通过 then() 的链式调用可以串联多个 同步/异步 任务; //规避回调地狱 let p = new Promise...then 链式调用时,在中间中断,不再调用后面的函数; 方法:在回调函数中返回一个状态为 pending 的 promise 对象; let p = new Promise((resolve, reject

    2.6K10

    回调地狱解决方案之Promise

    ,成功的结果回调回来向下执行 }) 上述代码只是一层级回调,如果代码复杂后,会出现多层级的回调,代码可读性也会很差,那有没有一种方式,不用考虑里面的内容,直接根据结果成功还是失败执行下面的代码呢?...我的理解: Promise使回调函数可以规范的链式调用 Promise原理与讲解 原理 Promise的三种状态 pending:进行中 fulfilled :执行成功 rejected :执行失败...对于这个空对象我们如果想继续做一些什么,需要进行处理,可以用非空Promise对这个空的进行赋值覆盖,然后继续then的链式调用。...几个常用api Promise.resolve resolve方法用来将一个非Promise对象转化为Promise对象 转换的对象是一个常量或者不具备状态的语句,转换后的对象自动处于resolve状态...状态不可逆性 resolve函数和reject函数只是传递异步结果 then进行层级调用的时候,每次的返回值都一个空promise对象,如果想继续使用,赋值替换掉空promise对象,但是返回的时候return

    1.4K30

    Java8特性大全(最新版)

    方法引用表达式无需显示声明被调用方法的参数,根据上下文自动注入。方法引用能够提高 Lambda 表达式语言的优雅性,代码更加简洁。...// 通过断言型接口实现元素的过滤 stream.filter(x->x.getSalary()>10); 非空过滤 非空过滤包含两层内容:一是当前对象是否为空或者非空;二是当前对象的某属性是否为空或者非空...筛选非空对象,语法stream.filter(Objects::nonNull)做非空断言。...,能够更加优雅的实现对象流的排序。...2、链式取值 链式取值是指,层层嵌套对象取值,在上层对象不为空的前提下,才能读取其属性值,然后继续调用,取出最终结果值。有时候只关心链末端的结果状态,即使中间状态为空,直接返回空值。

    2.2K20

    js异步编程的三种模式_2023-03-02

    我们常用的setTimeout和setInterval函数,Ajax都是异步操作。那么如何实现异步编程呢,笔者介绍几种方法回调函数(Callback)回调函数,这是异步编程最基本的方法。...Promise对象Promise对象用于表示一个异步操作的最终状态(完成或失败),以及其返回的值。...但其实,Promise的真正强大之处在于它的多重链式调用,可以避免层层嵌套回调。  我们先使用new来构建一个promise。...then方法接收两个函数作为参数,第一个参数是Promise执行成功时的回调,第二个 参数是Promise执行失败时的回调。...Promise对象的then方法返回一个新的Promise对象,因此所以可以通过链式调用then方法。我们还可以继续优化一丢丢。

    53610

    实用主义:Promise让异步回调更加优雅

    如果只有一个简单的异步操作,我们可以稍费脑子理清执行顺序,但是如果有多个异步方法,呃,我们就可能掉进了回调陷阱,事情远远没有我们想到的那么简单,并且我们甚至还没考虑过异步中抛出的错误。...还好Promise的出现,解救了我们,这篇文章不是讲解Promise的详细使用方法,只是通过两个例子,看看Promise的优雅之处,详细资料请参考阮一峰老师 《ES6标准入门》 传统的ajax回调 代码运行于最新的...结果 这是一个传统的ajax回调,我们把所有事务逻辑封装在onreadystatechange事件中,并且xhr的生成与使用都在一块代码内。...结果 我们通过then(resolve方法的别名),进行回调操作,then方法返回的也是一个Promise对象,因此可以链式调用,这样我们可以按步骤操作返回的数据。...最后 相比传统的ajax方法,Promise的优雅之处在于 关注点分离,每一次调用只需要完成一个任务; 更符合人脑思考逻辑; 良好的错误处理逻辑,错误冒泡; all() 和 race()方法避免陷入回调地狱

    78880
    领券