微信小程序获取后台数据的传参问题

Question

各位大佬，我是个新手，刚上手小程序开发，我想通过动态绑定，使后台可以改URL来随时可改页面轮播图片。写的时候遇到一个问题，以下是小程序的JS文件，我按以下写法，imageLink在then()里能获得res.data.image_url的值，而且打印点1也能打出来正确URL地址。但是在then()外面imageLink又为空了，打印点2也显示undefined，所以image也拿不到URL。

//获取应用实例
const app = getApp();

Page({
  data: {
    image: ''
  },
  //监听页面初次渲染完成
  onReady: function () {
    let tableID = 11111
    let recordID = '6be0ad376ef5e65b4967718e'
    var imageLink =''

    let Product =  new wx.BaaS.TableObject(tableID)
    Product.get(recordID).then(res => {
      // success
      imageLink = res.data.image_url
      console.log(imageLink)  //打印点1
    }, err => {
      // err
    })
    console.log(imageLink) //打印点2
    this.setData({
      image: imageLink
    })
  },
})

所以我改成以下这样，在then()里setData()，image就能正常拿到URL值了，打印点3也能正常打印，但是打印点4却是空值。为什么image在then()里面拿到了URL值，在外面却又变成空的了？难道是两个不同的对象吗？如果是不同的对象，按理说WXML中动态绑定的标签应该拿不到URL，那为什么WXML中动态绑定的标签又能正常显示图片了呢？

//获取应用实例
const app = getApp();

Page({
  data: {
    image: ''
  },
  //监听页面初次渲染完成
  onReady: function () {
    let tableID = 11111
    let recordID = '6be0ad376ef5e65b4967718e'

    let Product =  new wx.BaaS.TableObject(tableID)
    Product.get(recordID).then(res => {
      // success
      this.setData({
        image: res.data.image_url
      })
      console.log(this.data.image) //打印点3
    }, err => {
      // err
    })
    console.log(this.data.image) //打印点4
  },
})

我学艺不精，虽然最近学了小程序开发和JavaScript，但是没有搞懂上面这是为什么，希望有大佬能解答一下我的疑惑，我也能知道自己是哪里学漏了，谢谢大家！

Answer 1

打印点3跟打印点4是异步的，打印点4先打印，那时候还没拿到数据，打印点3后来拿到数据了，就渲染到页面上了。。。可以看看promise的运行顺序,可参考这个链接描述