高阶组件（hoc）是react中一项有趣的技术，用于重构共享几乎相同逻辑的类似组件。我知道这听起来很抽象而且很高级。然而，它是一种并非特定于react的架构模式，因此您可以使用该方法来做很多事情。
例如，您可以使用它向某个组件添加加载指示器，而无需调整原始组件，或者您可以隐藏组件的属性以使其不那么冗长。应用程序有很多，我试图在本教程中介绍其中的大部分。
还有其他几个教程可以教您有关HOC的知识，但其中大多数都是针对高级React开发人员的。当我开始学习React时，我很难理解高阶组件的概念以及如何将HOC合并到我的项目中以编写更好的代码。本文将解释您需要了解的HOC从头到孵化的所有内容。
概述
本教程分为三个部分。第一部分将介绍高阶组件的概念。在这里，我们将讨论在查看高阶函数和HOC之前需要了解的语法。第二部分是本系列中最令人兴奋的部分，您将看到HOC的实际示例。我们将使用HOC来创建表单、授权和许多其他事情。
在本教程的第三部分中，我们将更多地关注最佳实践以及实现高阶组件时需要考虑的事项。我们还将简要介绍React中代码共享的替代模式，例如Renderprops。
在开始之前，最好先看看有状态组件与无状态组件的教程，以便更好地理解React的组件架构。
ES6语法备忘单
我们很快就会动手。但在此之前，我认为您应该了解一些事情。我更喜欢尽可能使用ES6语法，它与HOC配合得很好。作为初学者，HOC有意义，但某些ES6语法却没有意义。因此，我建议您先浏览一遍本节，稍后您可以再回来参考。
箭头函数
箭头函数是常规函数表达式，但语法较短。它们最适合非方法函数，这也是我们特别感兴趣的。以下是一些帮助您入门的示例：
