React各生命周期函数的调用顺序

刚开始学习react时总是搞不清楚相关函数的调用顺序，导致写出的代码可能存在不可预期的现象。后来写了一段验证代码，确定了调用顺序如下

- start
componentWillMount
render
componentDidMount
componentWillUpdate
render
componentDidUpdate
- setState
componentWillUpdate
render
componentDidUpdate
- changePropsInParentComponent
componentWillReceiveProps
componentWillUpdate
render
componentDidUpdate

验证代码如下

子组件MyChild代码

import React from 'react';

const lifeCircle = ['start'];

let hOutputTimer = null;
function addLog(msg) {
    lifeCircle.push(msg);

    if (hOutputTimer) {
        clearTimeout(hOutputTimer);
    }
    hOutputTimer = setTimeout(() => {
        console.log(lifeCircle.join('\r\n'));
        lifeCircle.length = 0;
        hOutputTimer = null;
    }, 10000)
}
export