Angular：使用$ q.all进行可选promise？

Question

我重构了代码，使代码更整洁，没有重复。 但是我想知道在我的情况下$q.all的使用$q.all是最好的选择...

代码逻辑：

• 我有一个“可选”的承诺。 在一种情况下，我需要调用一个外部API（= promise），在另一种情况下，我不需要该外部调用（= no promise）。
• 因此，我创建了一个变量，可以在其中存储promise（对于没有promise的场景，则为null ）。
• $q.all等待诺言，然后检查返回值是诺言（场景1）返回的值还是null （场景2）。

重构前的功能

model.updateWish = function(wish) {
        var defer = $q.defer();

        if (wish.image) {
            // Rename temporary image.public_id to wish_id
            cloudinaryService.renameImage(wish.image.public_id, wish._id,
              function (image) {
                // Update wish with renamed image
                wish.image = image;
                $http.put(URLS.WISH + "/" + wish._id, wish).success(function (wish) {
                    updateWishlist(wish);
                    defer.resolve(wish);
                    console.info("wish updated", wish);
                });
            });
        } else {
            $http.put(URLS.WISH + "/" + wish._id, wish).success(function (wish) {
                updateWishlist(wish);
                defer.resolve(wish);
                console.info("wish updated", wish);
            });
        }
        return defer.promise;
    }

重构后的代码

model.updateWish = function(wish) {
        var defer = $q.defer();

        var renamedImagePromise = null;
        if (wish.image) {
            // Rename temporary image.public_id to wish_id
            renamedImagePromise = cloudinaryService.renameImage(wish.image.public_id, wish._id)
              .then( function (image) {
                // Update wish with renamed image
                wish.image = image;
                return wish;
            });
        }
        // Wait until renameImagePromise is resolved and send updated wish to server
        $q.all([renamedImagePromise]).then(function(wishWithRenamedImage){
            if (wishWithRenamedImage[0]) { // $q.all returns an array, wish is in "wishWithRenamedImage[0]"
                wish = wishWithRenamedImage[0];
            }
            $http.put(URLS.WISH + "/" + wish._id, wish).success(function (wish) {
                updateWishlist(wish);
                defer.resolve(wish);
                console.info("wish updated", wish);
            });
        })
        return defer.promise;
    }

这两个功能都可以工作，但是我想知道这是否是满足我要求的最佳实现...

Answer 1

使用$q.when ，同时避免使用延迟的反模式 ：

model.updateWish = function(wish) {
    ̶v̶a̶r̶ ̶d̶e̶f̶e̶r̶ ̶=̶ ̶$̶q̶.̶d̶e̶f̶e̶r̶(̶)̶;̶

    var renamedImagePromise = null;
    if (wish.image) {
        // Rename temporary image.public_id to wish_id
        renamedImagePromise = cloudinaryService.renameImage(wish.image.public_id, wish._id)
          .then( function (image) {
            var wishClone = Object.assign({},wish);
            // Update wish clone with renamed image
            wishClone.image = image;
            return wishClone;
        });
    };
    // Wait until renameImagePromise is resolved and send updated wish to server
    return $q.when(renamedImagePromise).then(function(wishWithRenamedImage){
        var wishToPut = wishWithRenamedImage || wish;
        return $http.put(URLS.WISH + "/" + wish._id, wishToPut)
         .then(function (resolve) {
            var wish = resolve.data;
            updateWishlist(wish);
            ̶d̶e̶f̶e̶r̶.̶r̶e̶s̶o̶l̶v̶e̶(̶w̶i̶s̶h̶)̶;̶
            console.info("wish updated", wish);
            return wish;
        });
    });
    ̶r̶e̶t̶u̶r̶n̶ ̶d̶e̶f̶e̶r̶.̶p̶r̶o̶m̶i̶s̶e̶;̶
};

更新资料

出于谨慎考虑，我修改了代码以克隆wish对象。 当对象引用传递给JavaScript函数时，该函数可以使该对象发生突变。 使用函数式编程的最佳实践，应避免更改对象。