关于javascript:串联执行N未知个函数

第一种形式，间接遍历循环：

这种形式最简略，要串联执行多个函数，能够遍历循环执行，代码如下：

// 1 let a1 = function (next) { console.log("a1"); } let a2 = function (next) { console.log("a2"); } let a3 = function (next) { console.log("a3"); } let arr = [a1,a2,a3]; arr.forEach(e=>e());

第二种形式,依照洋葱构造来结构代码构造，相似如图：

如何结构这样的代码呢，代码示例如下：

let a1 = function (next) { console.log("a1"); next() } let a2 = function (next) { console.log("a2"); next() } let a3 = function (next) { console.log("a3"); next() } let arr = [a1, a2, a3]; let a = arr.reduce(    (a, b) => { return () => b(a) },    () => console.log("start")); a();

察看源码，咱们在定义函数时为函数减少一个参数next，next是以后执行函数执行完后，下一个执行函数。

通过reduce函数的解决后，咱们失去了函数a，函数a的函数函数体，咱们能够利用数学中的函数代入失去后果:

function a () { console.log("a3");( function (next) {     console.log("a2");    ( function (next) {         console.log("a1");        ( () => console.log("start") )()         } )()         } )() } 

下面的代码除了用reduce之外咱们还能够应用循环来结构，代码如下：

let a1 = function (next) { console.log("a1"); next() } let a2 = function (next) { console.log("a2"); next() } let a3 = function (next) { console.log("a3"); next() } let arr = [a1, a2, a3]; let a = () => console.log("start"); for (let i = 0; i < arr.length; i++) {     let next = a;     a = ()=>{ arr[i](next) } } a();

a函数最终失去的后果和下面是一样的，只是办法不一样而已。

除了循环和reduce，咱们还能够应用递归，代码如下：

let a1 = function (next) { console.log("a1"); next() }let a2 = function (next) { console.log("a2"); next() } let a3 = function (next) { console.log("a3"); next() } let arr = [a1, a2, a3]; var i = 0; function next() { var task = arr[i++]; // 取出函数数组里的下一个函数     if (!task) {    // 如果函数不存在,    return return;     }     task(next); // 否则,执行下一个函数 }next();

递归调用原理也是相似结构一个回调函数，不过更趋向于流程化执行，更偏向于一边执行一边结构，而不是向下面两种形式，下面两种形式是先结构后执行。

浏览源码，咱们定义了一个next函数和以一个全局变量i，i来标记执行到哪一个函数了，next调用标记着递归调用开始，每次执行i都会递增，而后从数组中取出中间件执行，中间件执行时传递进next，反复进行下一个调用轮回。

以上便是串联执行N(未知)个函数多种形式，利用最多的就是js技术栈中的中间件，redux的中间件，express的中间件都是用的以上的办法，多操作，多思考，渺小改良每天提高一点点，心愿对你有所帮忙。