Question

我有一系列功能

var functionArray = [function1, function2, function3];

这些功能看起来像这样。一切都相同

var function2 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}

我想使用reduce和promises按顺序执行这些功能。但是下面的代码不起作用。我无法理解它。

var wrapper = (functionName, value) => {

    return new Promise((resolve, reject) => {
        functionName(value, (error, returnedValue) => {
            console.log(returnedValue);
            resolve(returnedValue);
        });
    });
}

var execute = function () {
    return functionArray.reduce((promise, currentFunction) => {
        return promise.then((value = 10) => {
            wrapper(currentFunction, value);
        });
    }, Promise.resolve());
};

当我调用execute时，值11会立即打印三次。我在这里错过了什么吗？

Live Snippet：

var function1 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}
var function2 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}
var function3 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}

var wrapper = (functionName, value) => {

    return new Promise((resolve, reject) => {
        functionName(value, (error, returnedValue) => {
            console.log(returnedValue);
            resolve(returnedValue);
        });
    });
}

var execute = function () {
    return functionArray.reduce((promise, currentFunction) => {
        return promise.then((value = 10) => {
            wrapper(currentFunction, value);
        });
    }, Promise.resolve());
};

var functionArray = [function1, function2, function3];
execute();

Answer 1

问题出在这里（***）：

return functionArray.reduce((promise, currentFunction) => {
    return promise.then((value = 10) => {
        wrapper(currentFunction, value); // ***
    });
}, Promise.resolve());

你不是返回 wrapper生成的承诺，因此then回调的结果是undefined，所以承诺你是打电话给它并不是因为这个新的承诺。因此，wrapper一个接一个地被调用三次，两秒钟后，超时发生。它还说明了为什么你得到11次三次：后续调用没有看到前一个调用的结果（他们看到undefined），所以每次value获得默认值10

如果您退回承诺，请：

return functionArray.reduce((promise, currentFunction) => {
    return promise.then((value = 10) => {
        return wrapper(currentFunction, value);
    });
}, Promise.resolve());

或：

return functionArray.reduce((promise, currentFunction) => {
    return promise.then((value = 10) => wrapper(currentFunction, value));
}, Promise.resolve());

...它按预期展开，他们看到并使用上一次调用的返回值：

var function1 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}
var function2 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}
var function3 = (value, callback) => {
    setTimeout(() => {
        value++;
        callback(null, value);
    }, 2000);
}

var wrapper = (functionName, value) => {

    return new Promise((resolve, reject) => {
        functionName(value, (error, returnedValue) => {
            console.log(returnedValue);
            resolve(returnedValue);
        });
    });
}

var execute = function () {
    return functionArray.reduce((promise, currentFunction) => {
        return promise.then((value = 10) => {
            return wrapper(currentFunction, value);
        });
    }, Promise.resolve());
};

var functionArray = [function1, function2, function3];
execute();

Answer 2

返回值不正确。

参数始终为10.

  return wrapper(currentFunction, value, timeout);

见：

https://jsfiddle.net/js1n6xL3/3/

也许这对你也有帮助： https://gist.github.com/anvk/5602ec398e4fdc521e2bf9940fd90f84

使用reduce和promises顺序执行数组中的函数

2 个答案: