zoukankan      html  css  js  c++  java
  • Promise异步操作

    Promise是es6中新增加的类(new Promise),目的为了管理JS中异步编程,也叫“Promise”设计模式

    Promise用来解决异步问题。本身是同步的,只是用来管理异步编程的一种模式

    所谓Promise,简单说就是一个容器(壳子),里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果

    promise对象是一个构造函数,本身有resolve、reject、all方法,原型上有then、catch等方法

    三种状态

    • pending 准备状态
    • fulfilled 成功状态(resolve)
    • rejected 失败状态(reject)

    最终只有两个状态,1、准备 2、成功或者失败

       let p = new Promise((resolve,reject)=>{
            setTimeout(function(){
                let txt = '呼伦贝尔';
                resolve(txt)//resolve时候执行成功的 呼伦贝尔
                //reject(err)  //reject时候执行失败的 err
            },1000)
       });
       p.then((data)=>{
           console.log(data);
       },(err)=>{
           console.log('err')
       })
       /*
        1、异步操作放在Promise传的函数里面
        2、Promise的参数与 then的参数相对应
      */

    Promise对象的特点

    1. Promise对象的状态不受外界影响。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态
    2. 一旦状态改变,就不会再变。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected

    promise中excutor执行器,默认new时候会立即调用

    每一个promise的实例上都有一个then方法,用来指定resolved和rejected状态的回调函数

    其中then方法可以写多个链式调用(前提需要保证执行完then返回的依然是promise实例)

        let pro = new Promise((resolve,reject) =>{
        //执行一个异步操作
        let xhr = new XMLHttpRequset();
        xhr.open('get','1.js',true);
        xhr.onreadyStatechange() = function(){
            if(xhr.readyState === 4 && xhr.status === 200){
                val = xhr.responseText;
                resolve(val);//成功
            }
            if(xhr.status!==200){
                reject();//失败
            }
        }
        xhr.send();
    })
    pro.then((resolve)=>{
        console.log('ok');
        //数据绑定
    },(reject)=>{
        console.log('error');
    }).then(()=>{
        //当第一个then中的函数执行完,会执行第二个
    }).then(()=>{
         //当第二个then中的函数执行完,会执行第三个
    })

    promise支持多个并发的请求,获取并发中的数据

    Promise请求过来的数据,可能是null,也可能是数组,是数组就进then()遍历,返回的null不需要then()

    promise.prototype.catch()

    该方法是.then(null, rejection)的别名,用于指定发生错误时的回调函数

     getJSON('/bosh.json').then(function(bosh){
        //...
      }).catch(function(err){
        // 处理 getJSON 和 前一个回调函数运行时发生的错误
         console.log('发生错误!', error);
      })

    一般来说,不要在then方法里面定义reject 状态的回调函数(即then的第二个参数)

    也就是在then里面执行成功信息,在catch里面执行错误信息

      // 不推荐
      promise
        .then(function(data) {
          // success
        }, function(err) {
          // error
        });
    
      // 推荐
      promise
        .then(function(data) { //cb
          // success
        })
        .catch(function(err) {
          // error
        });

    promise.all

    Promise.all方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。返回的每个成员都是 Promise 实例

    等待所有的promise都成功执行then,反之只要有一个失败就会执行catch

    Promise.all([p1,...]).then();
  • 相关阅读:
    了解及使用IPV6
    天气预报API(六):中国气象频道、腾讯天气--“新编码”接口的测试
    天气预报API(五):城市代码--“新编码”和“旧编码” 对比
    天气预报API(三):免费接口测试(“旧编码”)
    nginx 配置反向代理和静态资源
    centos 7 安装mysql5.7
    java 重新学习 (四)
    java 重新学习 (三)
    java 重新学习 (二)
    h5唤醒手机拨打电话
  • 原文地址:https://www.cnblogs.com/theblogs/p/10611589.html
Copyright © 2011-2022 走看看