处理 returns 承诺或空值的函数

Question

我定义了一个函数如下：

function getCurrentComponent(){
    if($rootRouter._currentInstruction){
        return $rootRouter.recognize($rootRouter._currentInstruction.urlPath).then(function (data) {
            return data.component.componentType;
        });
    }else{
        return null;
    }
}

为了调用这个函数，我做了如下操作：

factory.getCurrentComponent().then(function (data) {
    ...
});

问题是当getCurrentComponent函数returns为空值时，会产生如下错误：

Cannot read property 'then' of null

我该如何解决这个问题？

编辑：

我忘了说我仅限于使用 ES5，所以我不能使用对象 Promise

Answer 1

使用Promise.reject()函数。

function getCurrentComponent() {
  if ($rootRouter._currentInstruction) {
    return $rootRouter.recognize($rootRouter._currentInstruction.urlPath).then(function(data) {
      return data.component.componentType;
    });
  } else {
    return Promise.reject('_currentInstruction is fale');
  }
}

factory.getCurrentComponent().then(function(data) {
  ...
}).catch(function(e) {
  console.log(e); // Output: _currentInstruction is fale
});

资源

Promise.reject()

如果您无法使用 Promise，您可以 return 具有函数 then 的对象。

function getCurrentComponent() {
  if ($rootRouter._currentInstruction) {
    return $rootRouter.recognize($rootRouter._currentInstruction.urlPath).then(function(data) {
      return data.component.componentType;
    });
  } else {
    var helperThen = { then: function(fn) { fn(null) } };
    return helperThen;
  }
}

factory.getCurrentComponent().then(function(data) {
  // Check if data is null.
  ...
});

Answer 2

将函数转换为使用 Promise。

function getCurrentComponent(){
    return new Promise((resolve, reject)=>{
      if($rootRouter._currentInstruction){
          resolve( $rootRouter.recognize($rootRouter._currentInstruction.urlPath).then(function (data) {
              return data.component.componentType;
          }));
    } else{
        reject(null);
    })
}

现在您可以使用 then() 函数检查 resolve 和 reject，

factory.getCurrentComponent().then(function (resolved) {
    //handle success here
}, function(rejected) {
   // handle rejection here
});

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

Answer 3

I cant use the object Promise in ES5.

使用AngularJS $q Service:

function getCurrentComponent(){
    if($rootRouter._currentInstruction){
        return $rootRouter.recognize($rootRouter._currentInstruction.urlPath).then(function (data) {
            return data.component.componentType;
        });
    }else{
        ̶r̶e̶t̶u̶r̶n̶ ̶n̶u̶l̶l̶;̶
        return $q.reject(null);
    }
}

AngularJS 通过提供自己的事件处理循环来修改正常的 JavaScript 流程。这将 JavaScript 分为经典和 AngularJS 执行上下文。只有在 AngularJS 执行上下文中应用的操作才能受益于 AngularJS 数据绑定、异常处理、属性监视等

promises/deferred 对象的 $q Service is a Promises/A+ 兼容实现与 AngularJS 框架及其摘要循环集成。

处理 returns 承诺或空值的函数

handle a function that returns a promise or a null value

javascript

ecmascript-5

angularjs

angular-promise

编辑：

资源