高阶函数
高阶函数是指这样一种函数：接收函数作为参数，或将函数作为参数，或将函数作为输出返回。在前面的内容中介绍了使用map()函数实现列表渲染的例子，实际上就是用JavaScript内置的高阶函数实现的。 理解了高阶函数的定义，那么它有何价值和作用呢？它的目的和组件拆分类似：将复杂逻辑拆分成可复用的更小的逻辑单元。
高阶函数的典型用法如下：
const add = x => y => x + y console.log(add(1)(2)) // 3 复制代码
上面代码看起来晦涩难懂，因为使用es6箭头函数进行了简写，经过babel转换后，代码看起来就直观易懂了。
var add = function add(x) { return function(y) { return x + y } } console.log(add(1)(2) // 3 复制代码
高阶组件
高阶函数本质上就是一个函数，特殊的是它的接收值和返回值都是函数。类似地，高阶组件本质上也是一个函数，特殊的是它的接收值和返回值都是组件。
例如，需要给每个组件添加值为ok的status属性，可以定义一个Container高阶组件，代码如下：
const Container = e => { class extends React.Component { return () { let newProps = { status: 'ok' } return <e { ...this.props }{ ...newProps } /> } } } 复制代码
上述实现方式称为属性代理，高阶组件在render()函数中返回了传入的React组件，并且可以传递和添加新的属性（Props）
props在React中可以使用它进行组件之间的参数传递。
属性代理实现的高阶组件使用起来也十分简单，只需用高阶组件包裹起来，然后正常调用即可。例如，返回hello world的app组件，代码如下：
export default class App extends React.Component { render() { return ( <div>hello world</div> ) } } 复制代码
使用高阶组件Container向app组件添加值为ok的status属性，代码如下：
class App extends React.Component { render() { return ( <div>hello world</div> ) } } export default Container(App) 复制代码
此时，调用该组件的写法没有任何的改变，代码如下:
import App from "./App" ReactDOM.render(<App />, document.getElementById('root') 复制代码
另外，还可以通过es6新增的装饰器(decorator)进一步简化高阶组件的调用。
@Container export default class App extends React.Component { render() { return ( <div>hello world</div> ) } } 复制代码
装饰器是一种与class类相关的语法，用来注释或修改类和类方法。它作用的对象是一个类或其他属性方法，在不改变原有功能的基础上增强其功能。
一般来说，高阶组件主要用于控制组件的属性和状态，以及渲染劫持（为组件添加统一的样式或布局等）.
