React生命周期详解

  生命周期函数的概念和使用是React当中比较重要的一部分，我会在这篇博客中详细地介绍React生命周期函数

1、定义

  生命周期函数指在某一个时刻组件会自动调用执行的函数。
  看了这个定义，大家应该会想到render函数，当state或props改变时会自动执行，符合条件，所以render函数就是一个生命周期函数。constructor构造函数在组件被创建的时刻也会被自动调用，也符合条件，但是constructor函数并不是React所独有的，而是ES6语法中存在的函数，所以我们不把它归类到React生命周期函数，但我们要明白，它们的作用都是大同小异的。

2、四个过程

1. Initialization，初始化过程
   实际上就是指constructor构造函数，对组件数据进行初始化
2. Mounting,挂载过程
   首先要明白挂载的定义：React.js 将组件渲染，并且构造 DOM 元素然后塞入页面的过程称为组件的挂载（这个定义请好好记住）
   由三个生命组件函数构成：componentWillMount (挂载前执行) -> render -> componentDidMount（挂载后执行）
   值得注意的是：componentWillMount和componentDidMount 只会在挂载页面的时候执行，也就是组建在第一次放在页面的时候执行，对于之后的Updation过程是不会调用componentWillMount和componentDidMount这两个函数的
3. Updation,更新过程
   先说props和state的三个共同函数：
   shouldcomponentupdate: 组件被更新之前，会自动执行，需要返回一个布尔值，返回true继续执行下面函数，返回faulse停止执行Updation过程。
   componentWillUpdate和componentDidUpdate 分别是在组件更新之前和组件更新之后执行，值得注意的是：如果shouldComponentUpdate返回true它才会执行
   props特有的componentWillReceiveProps：一个组件要从父组件接收参数，如果这个组件第一次存在于父组件中不会执行，如果这个组件之前已经存在于父组件中才会执行
4. Unmounting,删除过程
   componentWillUnmount:当这个组件即将被从页面中删除时才会执行

这就是React生命周期函数的大致介绍