闭包的应用-JS高阶编程技巧之compose函数

compose 函数

1. 执行一系列任务(函数)
2. 第一个函数可以接受多个参数
3. 后面的函数都只能接受一个参数

// 将 task 中的任务一一执行,而 val 是首个任务的参数
let task = [step1, step2, step3];
compose(...task)(val);

应用: 函数嵌套调用的扁平化

const add1 = x => x + 1;
const add2 = x => x * 3;
const add3 = x => x / 2;

function compose(...funcs) {
    // funcs 接受的是所有传递进来的函数 [add1, add2, add3]
    return function anonymous(val) {
    // 将大函数存储下来的参数放到小函数内处理
        // val 第一个函数执行时候需要的实参  0
        if(funcs.length === 0) return val => val;
        if(funcs.length === 1) return val => funcs[0](val);
        return funcs.reduce((N, item) => item(N), val);
    }
}

/*
// 拓展: redux 中 compose 写法: 大函数直接判断返回对应的小函数
function compose(...funcs) {
// 将大函数的参数先判断处理,再提供给小函数调取
    if(funcs.length === 0) return val => val;
    if(funcs.length === 1) return val => funcs[0](val);
    return funcs.reduce((N, item) => val => item(N), val);
}
*/

// 需求: 执行 add1(0) => 返回结果传入 add2 执行 => 返回结果传入 add3 执行
compose(add1, add2, add3)(0); //=> 1.5

/* 
//=> reduce 
let arr = [10, 20, 30, 40];
arr.reduce((N, item) => {
    // 第一次: 10  20
    // 第二次: 30  30
    // 第三次: 60  40
    // ...
    // reduce 只传递一个回调函数,那么 N 第一次默认是第一项,后续的 N 是上一次函数执行的返回结果
    // reduce 传递了第二个参数,那么第二个参数就是 N的第一次的默认值,item 则是第一项
    
    console.log(N, item);
    return N + item;
});
*/