JavaScript Promise 离别异步乱嵌套

什么是Promise?

在说Promise之前, 不能不说一下,JavaScript的嵌套的回调函数

在JavaScript语言中, 无论是写浏览器端的种种事宜回调、ajax回调,照样写Node.js上的营业逻辑,不能不面临的题目就是种种回调函数。回调函数
少了还好,一旦多了起来而且必需考究实行递次的话,回调函数最先嵌套,那代码的恶心水平是相称不符合凡人的线性头脑的。

个人认为Promise就是为了把JS庞杂的嵌套转换成凡人头脑的线性代码。

// 就像下面如许:
// 你不在意下面这三个ajax的实行递次还好
// 假如你在意递次呢?
$.get('url', function(){
    
}, 'json');
$.get('url1', function(){
    
}, 'json');
$.get('url2', function(){
    
}, 'json');

// 就像如许?
$.get('url', function(){
    $.get('url1', function(){
        $.get('url2', function(){
    
        }, 'json');
    }, 'json');
}, 'json');


// 下面是我近来写的一段Node.js的代码
// 实在这个嵌套也不算多
// 假如营业逻辑相称庞杂起来呢?
// 嵌套20 30层?
var adminIndex = function(params, callback){
  storeAdmin.getApiTokens(function(err, tokens){
    if ( err ) { callback(err); return; }
    storeAdmin.getApiServices(function(err, apiServices){
      if ( err ) { callback(err); return; }
      storeAdmin.getSocketioServices(function(err, socketioServices){
        if ( err ) { callback(err); return; }
        callback(0, {
          status : true,
          data : {
            api_tokens : tokens,
            api_services : apiServices,
            socketio_services : socketioServices
          }
        });
      });
    });
  });
};

说了这么多, 究竟什么是Promise呢?

实在, Promise就是一个类,而且这个类已成为ES6的规范,这个类现在在chrome32、Opera19、Firefox29以上的版本都已支撑了,要想在所有浏览器上都用上的话就看看es6-promise吧。

那Promise怎样用呢?

那看一段很简单的代码,请注意浏览代码中的解释。

var val = 1;

// 我们假定step1, step2, step3都是ajax挪用后端或者是
// 在Node.js上查询数据库的异步操纵
// 每一个步骤都有对应的失利和胜利处置惩罚回调
// 需求是如许,step1、step2、step3必需按递次实行
function step1(resolve, reject) {
    console.log('步骤一:实行');
    if (val >= 1) {
        resolve('Hello I am No.1');
    } else if (val === 0) {
        reject(val);
    }
}

function step2(resolve, reject) {
    console.log('步骤二:实行');
    if (val === 1) {
        resolve('Hello I am No.2');
    } else if (val === 0) {
        reject(val);
    }
}

function step3(resolve, reject) {
    console.log('步骤三:实行');
    if (val === 1) {
        resolve('Hello I am No.3');
    } else if (val === 0) {
        reject(val);
    }
}

new Promise(step1)
    .then(function(val) {
        console.info(val);
        return new Promise(step2);
    })
    .then(function(val) {
        console.info(val);
        return new Promise(step3);
    })
    .then(function(val)  {
        console.info(val);
        return val;
    })
    .then(function(val) {
        console.info(val);
        return val;
    });

// 实行以后将会打印
步骤一:实行
Hello I am No.1
步骤二:实行
Hello I am No.2
步骤三:实行
Hello I am No.3
Hello I am No.3

Promise究竟处理什么题目?

正如上面代码所示,个人认为Promise的意义就在于then链式挪用,他避免了异步函数之间的层层嵌套,将本来异步函数的嵌套函数转变为便于浏览和明白的链式步骤关联

Promise的重要用法就是将各个异步操纵封装成很多Promise,而一个Promise只处置惩罚一个异步操纵。末了将各个Promise用链式挪用写法串连,在如许处置惩罚下,假如异步逻辑之间前后关联很重的话,你也不需要层层嵌套,只需要把每一个异步逻辑封装成Promise链式挪用就能够了。

Promise经常使用的症结点

在Promise定义时,函数已实行了

Promise组织函数只接收一个参数,即带有异步逻辑的函数,这个函数在new Promise时已实行了。只不过在没有挪用then之前不会resolve或reject

在then中的resolve要领中怎样return?

在then要领中一般通报两个参数, 一个resolve函数, 一个reject函数(暂时不议论,就是失足时运转的函数罢了)。resolve函数必需返回一个值才能把链式挪用举行下去,而且这个值返回什么是有很大考究的。

  • resolve返回一个新的Promise
    返回一个新Promise以后再挪用的then就是新的Promise中的逻辑了。

  • resolve返回一个值
    返回一个值会通报到下一个then的resolve要领参数中。

    原文作者:learn_shifeng
    原文地址: https://segmentfault.com/a/1190000005078431
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞