微信小程序开发中var that =this的用法详解
更新时间：2020年01月18日 10:47:24 作者：阿山
这篇文章主要介绍了微信小程序开发中var that =this的用法详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
在微信小程序开发中，var that =this的声明很常见。举个例子，代码如下！
示例代码1
//index.js
Page({
data: {
toastHidden: true,
},
loadData: function () {
var that = this//这里声明了that；将this存在that里面
wx.request({
url: 'test.php',
data: {a: 'a', b: 'b'},
header: {
'content-type': 'application/json'
},
success(res) {
that.setData({ toastHidden: false }) //这里使用了that，这样就可以获取Page({})对象
},
})
}
})
在代码中第9行声明了var that =this；第17行使用了that。
如果不声明var that =this，且that改成this，代码如下！
示例代码2
//index.js
Page({
data: {
toastHidden: true,
},
loadData: function () {
wx.request({
url: 'test.php',
data: {a: 'a', b: 'b'},
header: {
'content-type': 'application/json'
},
success(res) {
this.setData({ toastHidden: false })
},
})
}
})
此时运行代码就会报以下错误！
从报错中得知setData这个属性读不到，为何读不到？这跟this关键字的作用域有关！
this作用域分析：
1.在Page({})里面，this关键字指代Page({})整个对象
2.因此可以通过this关键字访问或者重新设置Page({})里data的变量
3.然而在loadData函数中使用了wx.request({})API这个方法导致在wx.request({})里没办法使用this来获取Page({})对象
4.虽然在wx.request({})里没法使用this获取Page({})对象，但是可以在wx.request({})外面先把this存在某个变量中，所以就有了var that =this 这个声明。此时that指代Page({})整个对象，这样子就可以在wx.request({})里使用that访问或者重新设置Page({})里data的变量
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章
这篇文章主要介绍了JS+CSS实现精美的二级导航效果代码,涉及JavaScript基于鼠标事件动态变换元素样式的技巧,非常简单实用,需要的朋友可以参考下2015-09-09
近几年随着JavaScript开发模式的逐渐成熟，CommonJS规范顺势而生，其中就包括提出了Promise规范，Promise完全改变了js异步编程的写法，让异步编程变得十分的易于理解2014-08-08
在 JavaScript 中，可以使用 performance.now() API 来评测代码的运行速度。该 API 返回当前页面的高精度时间戳，您可以在代码执行前后调用它来计算代码执行所需的时间，这篇文章主要介绍了JavaScript 评测代码运行速度,需要的朋友可以参考下2023-02-02
在JS中如果希望某个变量包含一个数值，那么无需限定其必须是整数或者是浮点数，下面来个例子2011-06-06
下面小编就为大家带来一篇最通俗易懂的javascript变量提升详解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
微信小程序MUI侧滑导航菜单示例(Popup弹出式,左侧不动，右侧滑动)
这篇文章主要介绍了微信小程序MUI侧滑导航菜单,结合实例形式分析了微信小程序Popup弹出式,左侧不动，右侧滑动菜单相关实现技巧与注意事项,需要的朋友可以参考下2019-01-01
这篇文章主要为大家介绍了GoJs的文本绘图模板TextBlock使用实例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-04-04
在 JavaScript 中,获取复选框（CheckBox）的状态（选中或未选中）可以通过以下几种方式实现,以下是具体方法及示例,并通过代码示例介绍的非常详细,需要的朋友可以参考下2025-03-03
这篇文章主要介绍了java设计模式中观察者模式，全文通过举例子及代码的形式进行了一个简单的介绍，希望大家能够理解并且学习到其中知识2021-08-08
JS实现仿google、百度搜索框输入信息智能提示的实现方法
这篇文章主要介绍了JS实现仿google、百度搜索框输入信息智能提示的实现方法,实例分析了javascript实现智能提示功能的技巧,非常具有实用价值,需要的朋友可以参考下2015-04-04
最新评论