Последовательное выполнение функций в массиве с помощью Reduce и Promises.

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 выводится сразу три раза.Я что-то здесь упускаю?

Живой фрагмент:

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

возвращаемые значения не верны.

Параметр всегда равен 10.

  return wrapper(currentFunction, value, timeout);

См .:

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

Может быть, это вам тоже может помочь: https://gist.github.com/anvk/5602ec398e4fdc521e2bf9940fd90f84

Answer 2

Проблема здесь (***):

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

Вы не возвращаете обещание, которое wrapper производит, поэтому результат обратного вызова thenundefined, и поэтому обещание, на которое вы его призываете, не подчинено этому новому обещанию.Таким образом, wrapper вызывается три раза один за другим, а через две секунды происходят тайм-ауты.Это также объясняет, почему вы получаете 11 три раза: последующие вызовы не видят результат предыдущего (они видят undefined), поэтому вы получаете значение по умолчанию 10 для value каждый раз.

Если вы возвращаете обещание, либо:

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();