php 高阶函数概念股,高阶函数和高阶组件

1.先来认识一下高阶函数

高阶函数解决的问题是将某一个横切面抽象出来

下面的两个方法，是对加法add做了一次抽离，让我们所有的加法，都通过add进行运算。这样既保证了add 这个加法运算不受污染，同时还能支撑我们的一部分业务逻辑，就是其中的addFive,addTen 。function add(p,q){

return p+q

}

function addFive(x,fn){

return fn(x,5)

}

function addTen(x,fn){

return fn(x,10)

}

addFive(1,add)     // 6

addTen(1,add)     // 11复制代码

可能会问，那为什么不直接下面这样写呢？function add(a,b){

return a+b

}

add(1,5) //6

复制代码

的确可以，但是可以把它想象的再复杂一点,let PEI = 1.1314926.........;

function addPEI(a,b){

return a+b

}

function add2PEI(a,b){

return a+2*b

}

addPEI(1,PEI)

add2PEI(1,PEI)复制代码

这个PEI 就是我们的需求，从这里就能看出来，我每次都要使用PEI，不变，比无限不循环可能还要复杂。那么在做一个类似的功能。我们还是需要处理类似于PEI ，这么复杂的需求，同样的，虽然返回的结果还是a+b 这样的加法逻辑形式(类似于 map 的for 循环)。

是不是就发现了最开始方法的好处，我们可以把这个加法逻辑给提出来，让它不受我们的业务影响，就是所谓的PEI 和2PEI?function add(p,q){

return p+q

}

function addPEI(a,fn){

let PEI = 1.1314926.........;

return fn(a,PEI)

}

function add2PEI(a,fn){

let PEI = 1.1314926.........;

return fn(a,2*PEI)

}复制代码

这样，我就再也不用关心PEI 有多复杂，只需要调用 addPEI，add2PEI 就可以了，PEI 可以看成项目中一段业务代码类似但是却及其复杂的一个代码块。

不过也可以看到，我们这里还是写了大量，重复的代码。上文我们提到了 PEI和2*PEI 是个复杂的逻辑，我么可以把这一部分也抽离出来。let PEI = 1.1314926.........;

function add(p,q){

return p+q

}

function addMaker(a,fn){

return (b)=>{

fn(a,b)

}

}

// let addPEI = addMaker(1,add)(PEI)

let addPEI = addMaker(1,add);

addPEI =  (b)=>{

add(1,b)

}

addPEI(PEI) = add(1,PEI)

// let add2PEI = addMaker(1,add)(2*PEI)复制代码

到现在基本上高阶组件也差不多了，

高阶组件主要是帮我们做了两件事。

1. 复用复杂的代码，针对一块代码，通过传参的方式，对这块代码进行复用，像PEI

2. 复用复杂的逻辑，像上面的a+b 这部分逻辑Hoc (a,fn)=>{

return (b)=>fn(a,b)

}

Hoc(1,fn)(2)复制代码

这段代码同时帮我们做到了。即能复用逻辑，也能复用代码

2.那再来看高阶组件，是不是同样的东西

我们抽离一个组件，在多处引用，这个代码就是PEI

同一个页面使用了不同 的PEI ，但是这个页面还是a+b 的逻辑。