是这样的 我知道setState是异步操作的，并且react有可能会合并几次setState，但是下面这段代码很想不明白

componentDidMount() {
    this.setState({
      value: this.state.value + 1,
    }, () => {
      console.log(this.state.value, '第一次回调执行完')
    });
    console.log(this.state.value);
    this.setState({
      value: this.state.value + 1,
    }, () => {
      console.log(this.state.value, '第二次回调执行完');
    });
    console.log(this.state.value);
    setTimeout(() => {
      console.log(this.state.value, '~~~~~~~~~~');
      this.setState({
        value: this.state.value + 1,
      }, () => {
        console.log(this.state.value, '第三次回调执行完')
      });
      console.log(this.state.value);
      this.setState({
        value: this.state.value + 1,
      }, () => {
        console.log(this.state.value, '第四次回调执行完')
      });
      console.log(this.state.value);
    }, 0)
  }
  
  /*
    0
    0
    1 "第一次回调执行完"
    1 "第二次回调执行完"
    1 "~~~~~~~~~~"
    2 "第三次回调执行完"
    2
    3 "第四次回调执行完"
    3  
  */

我是这么理解前面的，前面两次0是由于setState是异步操作，所以先执行的console，此时setState还没更新完，所以先打出了两次0，然后react合并了前两步setState操作，导致只执行了一次value+1，所以进入定时器开始时值是1，但是后面我就完全不懂了，为什么定时器中的setState的回调打印会先于直接console，而且这两步的setState为什么没有合并那