微信小程序开发中var that =this的基本用法

1. 什么是微信小程序？

微信小程序是微信公众平台推出的一种开放能力，是一种新型的应用形态。与传统的App不同，它不需要下载安装即可使用，用户可以在微信中直接打开使用。在微信小程序开发中，我们经常会用到var that = this的语法。

2. var that = this 的作用

在微信小程序的开发过程中，为了避免出现this指向问题，我们通常会使用var that = this的语法。它的作用是将this的值复制到that变量中，从而在后面使用that变量时保证this指向的不会改变。

2.1 解决this指向问题

this在JavaScript中的指向是非常灵活的，它的指向可以根据所处的上下文发生变化。如果不加以处理，就有可能出现指向错误的情况。

Page({
  data: {
    name: 'Tom'
  },
  handleClick: function() {
    console.log(this.data.name)
  }
})

在上面的代码中，如果在handleClick方法中直接使用this.data.name，就会出现指向错误的情况，因为this此时指向的是Page对象。为了避免这种情况的发生，我们可以使用var that = this的语法：

Page({
  data: {
    name: 'Tom'
  },
  handleClick: function() {
    var that = this
    console.log(that.data.name)
  }
})

通过使用var that = this的语法，可以将this的值复制到that变量中，从而在后面使用that变量时保证this指向的不会发生变化。

2.2 兼容性问题的解决

另外，由于不同浏览器对JavaScript的实现不尽相同，有些浏览器会将this指向全局对象window，而不是当前对象。这种情况下，使用this会出现错误。使用var that = this的语法可以兼容这种浏览器的实现。

3. 实例展示

下面通过一个实例来展示var that = this的应用：

Page({
  data: {
    name: 'Tom'
  },
  onLoad: function(options) {
    this.getData()
  },
  getData: function() {
    var that = this
    wx.request({
      url: 'https://www.example.com/getData',
      success: function(res) {
        that.setData({
          data: res.data
        })
      }
    })
  }
})

在上面的代码中，通过var that = this语法将this的值复制到that变量中，从而在后面的wx.request方法中，可以在success回调函数中通过that来调用setData方法，从而保证this指向的不会发生变化。

4. 总结

在微信小程序开发中，为了避免this指向问题，我们通常会使用var that = this的语法。它的作用是将this的值复制到that变量中，从而在后面使用that变量时保证this指向的不会改变。这种语法可以避免this指向错误、兼容各种浏览器实现等问题。我们需要在合适的时候使用这种语法来确保程序的正确性。