react的高阶函数HOC：

React 的高阶组件（Higher-Order Component，HOC）是一种用于复用组件逻辑的模式。它是一个函数，接收一个组件作为参数，并返回一个新的增强过的组件。

HOC 可以用于实现以下功能：

1. 代码复用：通过将共享的逻辑抽象成 HOC，多个组件可以共享同一段代码。

2. 控制组件：HOC 可以在组件包裹层级内对组件进行控制和操作，例如增加一些额外的 props 或包装组件在某些条件下显示/隐藏。

3. 渲染劫持：HOC 可以拦截组件的渲染流程，对组件的渲染进行干预。

下面是一个简单的示例，演示了如何创建一个 HOC：

import React from 'react';
 
const withLogger = (WrappedComponent) => {
  return class extends React.Component {
    componentDidMount() {
      console.log('Component is mounted');
    }
 
    render() {
      return <WrappedComponent {...this.props} />;
    }
  };
};

在这个例子中，withLogger 是一个 HOC，它接收一个组件作为参数，并返回一个新的增强过的组件。在返回的新组件中，我们在 componentDidMount 生命周期方法中添加了一个日志输出。

使用这个 HOC 将日志功能添加到某个组件中：

import React from 'react';
 
const MyComponent = () => {
  return <div>Hello, World!</div>;
};
 
const EnhancedComponent = withLogger(MyComponent);

通过调用 withLogger 函数并传入 MyComponent，我们创建了一个新的增强组件 EnhancedComponent，它具有日志功能。

HOC 是一种强大的模式，可以增强组件的功能并提高代码复用性。但是需要注意，过度使用 HOC 可能导致组件过于复杂和难以维护，因此需要谨慎使用。