嵌套的 Promise 无法正确解析，仅在使用分解的 Promise 处理程序时返回 Promise答案

【问题标题】：Nested promises not resolving properly, only returning promise when using decomposed promise handlers嵌套的 Promise 无法正确解析，仅在使用分解的 Promise 处理程序时返回 Promise
【发布时间】：2020-11-16 08:18:23
【问题描述】：

有类似的问题，如this、this 和this，但没有任何帮助。

我们有嵌套的 Promise，但它们没有解决。不是从最里面的 Promise 返回数据，而是最外面的 Promise 返回一个 Promise。

目标是将 Promise 处理程序分解为单独的函数，如下所示（例如，requestDidSucceed、requestDidFail）。

我们如何在确保最外层 Promise 正确返回的同时做到这一点？

Codepen

https://codepen.io/Crashalot/pen/0ba95ebb26d0f68fb95ea065ef6af3dd?editors=0002

代码

class TestClass {
    translate() {
        // Create promise.
        let promise = $.Deferred();     

        let bm = new BatchManagerClass();

        bm.translate()
        .then( successResult => requestDidSucceed(promise, successResult) )
        .catch( errorResult => requestDidFail(promise, errorResult) );

        // Return promise.
        return promise;
    }

  
    requestDidSucceed(promise, successResult) {
        promise.resolve(successResult);
    }


    requestDidFail(promise, errorResult) {
        promise.reject(errorResult);
    }
}


class BatchManagerClass {
    translate() {
        // Create promise.
        let promise = $.Deferred();     

        let test = new ServiceClass();

        test.makeRequest()
        .then( successResult => requestDidSucceed(promise, successResult) )
        .catch( errorResult => requestDidFail(promise, errorResult) );

        // Return promise.
        return promise;
    }
    

     requestDidSucceed(promise, successResult) {
        promise.resolve(successResult);
     }


     requestDidFail(promise, errorResult) {
        promise.reject(errorResult);
     }
}


class ServiceClass {
    makeRequest() {
       let promise = $.Deferred();      

       promise.resolve('This works');

       return promise;
    }  
}


let test = new TestClass();

test.translate()
  .then( successResult => requestDidSucceed(successResult) )
  .catch( errorResult => requestDidFail(errorResult) );


function requestDidSucceed(successResult) {
  console.log('Success result: ' + successResult);
}


function requestDidFail(errorResult) {
  console.log('Failure result: ' + errorResult);
}

【问题讨论】：

一个问题，你为什么不在课堂上使用this.requestDidSucceed？
bm.translate() .then( successResult => requestDidSucceed(promise, successResult) ) .catch( errorResult => requestDidFail(promise, errorResult) ); - 这不会调用它的方法，而是调用全局的requestDidSucceed(successReult) 函数。
@yash 因为那是错误。 :) 感谢您的帮助！
抱歉，您指的是哪封电子邮件？

标签： javascript ecmascript-6 promise es6-promise

【解决方案1】：

调用类的方法时，必须像this.requestDidSucceed()一样添加this.。

class TestClass {
    translate() {
        // Create promise.
        let promise = $.Deferred();     

        let bm = new BatchManagerClass();

        bm.translate()
        .then( successResult => this.requestDidSucceed(promise, successResult) )
        .catch( errorResult => this.requestDidFail(promise, errorResult) );

        // Return promise.
        return promise;
    }

  
    requestDidSucceed(promise, successResult) {
        promise.resolve(successResult);
    }


    requestDidFail(promise, errorResult) {
        promise.reject(errorResult);
    }
}


class BatchManagerClass {
    translate() {
        // Create promise.
        let promise = $.Deferred();     

        let test = new ServiceClass();

        test.makeRequest()
        .then( successResult => this.requestDidSucceed(promise, successResult) )
        .catch( errorResult => this.requestDidFail(promise, errorResult) );

        // Return promise.
        return promise;
    }
    

     requestDidSucceed(promise, successResult) {
        promise.resolve(successResult);
     }


     requestDidFail(promise, errorResult) {
        promise.reject(errorResult);
     }
}


class ServiceClass {
    makeRequest() {
       let promise = $.Deferred();      

       promise.resolve('This works');

       return promise;
    }  
}


let test = new TestClass();

test.translate()
  .then( successResult => requestDidSucceed(successResult) )
  .catch( errorResult => requestDidFail(errorResult) );


function requestDidSucceed(successResult) {
  console.log('Success result: ' + successResult);
}


function requestDidFail(errorResult) {
  console.log('Failure result: ' + errorResult);
}

【讨论】：