ES6 promise 常用方法介绍

一:promise 知识点:.then() catch() resolve()返回成功的值 reject()返回失败的值

用法:连续调用上次请求值做下一步操作

写法:

  1. 在第一步方法里面new 一个Promsie方法 用变量接收 传入值 function(resolve, reject){}
  2. 在传值函数里面执行请求或者得值操作,然后用相应的方法返回值 //resolve()返回成功的值 reject()返回失败的值
  3. 在第一步方法最后返回定义的变量

用法:

  1. 利用第一步方法.then 并传值function(data){}
  2. 其中data就是第一个函数请求来的值
  3. 如需继续进行其余请求方法 可以继续return 其余方法(其余方法定义同一方法定义步骤)

示例:

   1. function aa(){
    var p = new Promise(function(resovle, reject){
      //做一些请求值的异步操作,例如:
      setTimeout(function(){
          var num = Math.ceil(Math.random()*10); //比如这是请求来的值
              if(num<=5){ //满足条件
                  resolve(num);
              }else{ //不满足条件
                  reject('数字太大了');
             }
      })
       })
    return p;
     }

   2. aa().then(function(data){
    //这里的data就是aa()方法得出数据
    return 接下来的方法
      }).catch(function(reason){
    //这里是抛出异常后执行的函数,这里reason就是抛出异常的提示信息
      })

二:promise 知识点 all():将加入all方法的所有promise对象返回的值归集到 then方法里面统一展现

2. 示例:

   Promise.all([aa(), bb(), cc()])
   .then(function(resulte){
    //这里的resulte是包含了aa(), bb(), cc()返回值的一个数组
   })

三: promise 知识点 race(): 返回放入race方法里面执行最快的方法的值,可以用于给某个方法加入请求用时

3. 示例:

如果aa()方法是某个请求方法
bb()方法用于延时提示出某个信息

   function aa() {
     var p = new Promise(function(resolve, reject){
        var img = new Image();
        img.onload = function(){
            resolve(img);
        }
        img.src = 'xxxxxx';
     });
     return p;
   }

   function bb() {
     var p = new Promise(function(resolve, reject){
        setTimeout(function(){
            reject('图片请求超时');
        }, 5000);
     });
     return p;
   }

   Promise.race([aa(), bb()])
   .then(fucntion(resulte){
     //这里是返回aa()方法的值
   })
   .catch(function(reason){
     //这里返回的是bb()方法的值
   })

原文地址:https://www.cnblogs.com/yzyh/p/9060711.html

时间: 2024-10-11 18:07:57

ES6 promise 常用方法介绍的相关文章

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

Deferred 和 Promise ES6 和 jQuery 都有 Deffered 和 Promise,但是略有不同.不过它们的作用可以简单的用两句话来描述 Deffered 触发 resolve 或 reject Promise 中申明 resolve 或 reject 后应该做什么(回调) 在 jQuery 中 var deferred = $.Deferred(); var promise = deferred.promise(); 在 ES6 中 var deferred = Pro

Es6 Promise 用法详解

Promise是什么?? 打印出来看看  console.dir(Promise) 这么一看就明白了,Promise是一个构造函数,自己身上有all.reject.resolve这几个眼熟的方法,原型上有then.catch等同样很眼熟的方法.这么说用Promise new出来的对象肯定就有then.catch方法喽,没错. 那就new一个玩玩吧. var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(functi

ES6 Promise 异步操作

最近越来越喜欢与大家进行资源分享了,并且及时的同步到自己的园子内,为什么呢? 一.小插曲(气氛搞起) 在上个月末,由于领导的高度重视(haha,这个高度是有多高呢,185就好了),走进了公司骨干员工的队列,并参与为骨干员工准备的"高效能人士的七项修炼"课程培训. 那接下来我是不是该简明扼要的说一下七项修炼有哪些,很受用哦. 七项修炼之一:积极主动 ==> 积极心态去处理事情.不怕事. 七项修炼之二:明确方向 ==> 要做到以终为始,将终点作为起点,帮助你实现生活与工作中的重

ES6 Promise 对象

es6 Promise 对象是异步编程的一种解决方案.(在javascript世界里,是单线程顺序执行的)从语法上说,Promise 是一个对象,从它可以获取异步操作的消息. Promise 异步操作有三种状态:pending(进行中).fulfilled(已成功)和 rejected(已失败).除了异步操作的结果,任何其他操作都无法改变这个状态.Promise 对象只有:从 pending 变为 fulfilled 和从 pending 变为 rejected 的状态改变.只要处于 fulfi

你是否也在学习ES6 Promise时遇到过这个问题?

背景 周末闲来无事,随便翻看了一下阮一峰老师的<ES6 标准入门>第2版,ps:之前在阮一峰老师的官网看过电子版,感觉干货满满,所以就买了纸质版:当看到第16章第4节 'Promise.prototype.catch()'时,遇到了一个小困惑,下面我们来一起看一下 开胃汤 首先,Promise.prototype.catch方法是用来'捕获Promise回调函数中自然发生或主动抛出的错误',何为自然发生?何为主动抛出? 自然发生的错误: 1 function a() { 2 var x = 1

jQuery的Promise 这里介绍的很详细

原文电梯:https://www.cnblogs.com/yelongsan/p/7644239.html 先前了解了ES6的Promise对象,来看看jQuery中的Promise,也就是jQuery的Deferred对象. 打开浏览器的控制台先. <script> var defer = $.Deferred(); console.log(defer); </script> 运行代码 运行结果: 和ES6的Promise对象长的有点像,jQuery的Deferred对象也有re

Javascript中String、Array常用方法介绍

string和array作为javascript内置对象,其中许多方法无论是在开发过程中,还是在面试的时候都有机会被面试官问到,这里对经常用到的方法做一个介绍,这些方法都有过很多的实际应用场景,所以对它们的掌握还是非常有必要的. 1.Array数组常用方法? 先创建一个数组var abc = [1,2,3,4,5,6,7,8,9]; (1)pop(); 这个方法会删除数组的最后一项并返回删除掉的值. 比如:console.log(abc.pop());//9;    console.log(ab

使用ES6 +Promise组织异步代码

(1)为什么要使用promise这种设计模式,这种设计模式的好处是什么 解决 JavaScript 异步事件的传统方式是回调函数:调用一个方法,然后给它一个函数引用,当这个方法完结的时候执行这个函数引用. Javascript 中的神器--Promise Promise in js 回调函数真正的问题在于他剥夺了我们使用 return 和 throw 这些关键字的能力.而 Promise 很好地解决了这一切. 2015 年 6 月,ECMAScript 6 的正式版 终于发布了. ECMAScr

微信小程序 es6 promise

微信小程序开发两个月了.大家的项目都在不断迭代.已经不是小程序.这时候就会遇到多层回调嵌套的问题.有些目不忍视了.迫不得已引入es6-promise.在微信小程序内测的时候promise不需要手动引入,后来被微信移除了.看看效果. promise详细的介绍我就不说了.有很多大神写过. 阮一峰 promise入门 看看目录,引入es6-promise就可以用了. 1.网络请求 wxRequest.js 这里只写了get和post. 我经常会在网络请求的时候用微信原生showToast(),所以最后