Basic usage of var that =this in WeChat applet development

In WeChat applet development, the statement var that =this is very common. For example, the code is as follows!

Sample code 1

1  //index.js  
2  Page({  
3   
4   data: {  
5    toastHidden: true,  
6   },  
7   
8   loadData: function () {  
9      var that = this//这里声明了that；将this存在that里面  
10     wx.request({  
11       url: 'test.php',  
12       data: {a: 'a', b: 'b'},  
13       header: {  
14        'content-type': 'application/json'  
15       },  
16       success(res) {  
17           that.setData({ toastHidden: false }) //这里使用了that，这样就可以获取Page({})对象  
18        },  
19      })  
20    }  
21  
22  })

In the code, line 9 declares var that =this; line 17 uses that.

If you do not declare var that =this, and change that to this, the code is as follows!
Sample Code 2

1  //index.js  
2   Page({  
3  
4    data: {  
5     toastHidden: true,  
6   },  
7  
8    loadData: function () {  
9      wx.request({  
10      url: 'test.php',  
11      data: {a: 'a', b: 'b'},  
12      header: {  
13       'content-type': 'application/json'  
14      },  
15      success(res) {  
16        this.setData({ toastHidden: false })  
17       },  
18      })  
19   }  
20  
21  })

When running the code at this time, the following error will be reported!

I learned from the error report that the setData attribute cannot be read. Why can't it be read? This is related to the scope of this keyword!

this scope analysis:

1. In Page({}), the this keyword refers to the entire object of Page({})

2. Therefore, you can access or reset the data variable in Page({}) through this keyword

3. However, using the wx.request({}) API method in the loadData function results in wx There is no way to use this to get the Page({}) object in .request({})

4. Although there is no way to use this to get the Page({}) object in wx.request({}), but You can store this in a variable outside wx.request({}), so there is the statement var that =this. At this time, that refers to the entire object of Page({}), so that you can use that in wx.request({}) to access or reset the data variable in Page({})

Recommended tutorial: "JS Tutorial"

The above is the detailed content of Basic usage of var that =this in WeChat applet development. For more information, please follow other related articles on the PHP Chinese website!