React高阶组件HOC详解及其与Mins区别.pdfVIP

React常考进阶知识点

这⼀章节来学习React的⼀些经常考到的进阶知识点，并且

这章节还需要配合第⼗九章阅读，其中的内容经常会考到。

HOC？相⽐mixins有什么优点？

很多⼈看到⾼阶组件（HOC）这个概念就被吓到了，认为这东⻄很

难，其实这东⻄概念真的很简单，我们先来看⼀个例⼦。

functionadd(a,b)

{returna+b

}

现在如果给这个add函数添加⼀个输出结果的功能，那么你可

能会考虑我直接使⽤console.log不就实现了么。说的没错，但

是如果我们更加优雅并且容易复⽤和扩展，我们可以这样去

做：

functionwithLog(fn)

{functionwrapper(a,b){

constresult=fn(a,b)

console.log(result)

returnresult

}

returnwrapper

}

constwithLogAdd=withLog(add)

withLogAdd(1,