小程序setData函数深入分析

官方文档可以知道

setData函数改变Page的data是同步的，会异步通知视图层data的改变，视图层收到通知后进行渲染。即官方文档里生命周期的Send Data箭头（下图）

callback分析

先上代码：

Page({

  data: {
    theData: 1
  },

  onLoad: function(options) {
    console.log("data begin:" + this.data.theData);
    this.setData({
      theData: 2
    }, () => {
      console.log("callback");
    });
    console.log("data after:" + this.data.theData);
    /*长耗时*/
    for (var i = 0; i < 1000000; i++) {
      for (var j = 0; j < 2000; j++) {
        j++;
      }
    }
    console.log("data long after:" + this.data.theData);
  }

})

结果：

结论：
1、callback回调函数并不是视图层渲染成功后的回调，而是Page的data改变完成就执行callback。
2、从long after会比callback早打印可知，setData实际上是一个异步代码段（js单线程概念先理解好），只有for和long after打印后，console.log(“callback”);才会执行