小程序中为什么使用var that=this
前言:
在小程序或者js开发中,经常需要使用var that = this;开始我以为是无用功,(原谅我的无知),后来从面向对象的角度一想就明白了,下面简单解释一下我自己的理解,欢迎指正批评。
代码示例:
Page({
data: {
test:10
},
testfun1: function () {
console.log(this.data.test) //
function testfun2(){
console.log(this.data.test) //undefined
}
testfun2()
},
})
- 第一个this.data.test打印结果为10,原因是因为this的指向是包含自定义函数testfun1()的Page对象。
- 第二个打印语句实际上会报错,原因是在函数testfun2()中,this指向已经发生改变,也不存在data属性,会error:Cannot read property 'data' of undefined;
解决办法 为复制一份this的指向到变量中,这样在函数执行过程中虽然this改变了,但是that还是指向之前的对象。
testfun1: function () {
var that = this
console.log(this.data.test) //
function testfun2() {
console.log(that.data.test) //
}
testfun2()
},
onLoad:function(){
this.testfun1();
}
编译之后没有报错,正常打印出结果;

再来一项更明白的例子:
onLoad: function() {
var testvar = {
name: "zxin",
testfun3: function() {
console.log(this.name);
}
}
testvar.testfun3();
}
编译后输出结果:zxin。this.name指的是testvar对象,testfun3()也属于testvar对象。
总结:
大家知道this是指当前对象,只是一个指针,真正的对象存放在堆内存中,this的指向在程序执行过程中会变化,因此如果需要在函数中使用全局数据需要合适地将this复制到变量中。
小程序中为什么使用var that=this的更多相关文章
- 微信小程序中rpx与rem单位使用
原作者: 小小小 来自: 授权地址 本文讲解rpx和rem应用于微信小程序,如果你还没有入门,建议先从下面看起: 微信小程序官方文档web app变革之remrpx单位官方文档rpx单位基础介绍 ...
- 开发微信小程序中SSL协议的申请、证书绑定、TLS 版本处理等
在上篇随笔<基于微信小程序的系统开发准备工作>介绍了开发微信小程序的一些前期的架构设计.技术路线 .工具准备等方面内容,本篇随笔继续这个步骤,逐步介绍我们实际开发过程中对SSL协议的申请及 ...
- 在微信小程序中使用富文本转化插件wxParse
在微信小程序中我们往往需要展示一些丰富的页面内容,包括图片.文本等,基本上要求能够解析常规的HTML最好,由于微信的视图标签和HTML标签不一样,但是也有相对应的关系,因此有人把HTML转换做成了一个 ...
- JS 条形码插件--JsBarcode 在小程序中使用
在小程序中的使用: utils文件夹下 barcode.js 粘粘以下代码 var CHAR_TILDE = 126 var CODE_FNC1 = 102 var SET_STARTA = 103 ...
- 微信小程序中使用 <web-view> 内嵌 H5 时,登录问题的处理方法
在微信小程序的开发中,经常遇到需要使用 <web-view></web-view> 内嵌 H5 的需求.在这种需求中比较棘手的问题应该就是登录状态的判断了,小程序中的登录状态怎 ...
- 微信小程序中用户登录和登录态维护
提供用户登录以及维护用户的登录状态,是一个拥有用户系统的软件应用普遍需要做的事情.像微信这样的一个社交平台,如果做一个小程序应用,我们可能很少会去做一个完全脱离和舍弃连接用户信息的纯工具软件. 让用户 ...
- 全栈开发工程师微信小程序-中(下)
全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> ...
- 全栈开发工程师微信小程序-中(中)
全栈开发工程师微信小程序-中(中) 开放能力 open-data 用于展示微信开放的数据 type 开放数据类型 open-gid 当 type="groupName" 时生效, ...
- 微信小程序中的循环遍历问题
比如:如果在微信小程序中要遍历输出 0-9 的数,我们会使用for循环 ;i<;i++){ console.log(i); } 确实结果也是这样: 但是,如果我在循环时同时调用wx的api接口1 ...
随机推荐
- BZOJ 4034 树链剖分
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=4034 题意:中文题面 思路:树链剖分入门题. 剖分后就是一个简单的区间更新和区间求和问题. ...
- python常用函数 I
iter(iterable) 可以生成一个迭代器. 例子: islice(iterator, int, int) itertools的islice方法为迭代器生成器提供切片操作. 例子: izip_l ...
- [BZOJ4316]小C的独立集 仙人掌?
题目链接 因为xls让我每周模拟一次,然后学习模拟中没有学过的东西.所以就来学圆方树. 本来这道题用不着圆方树,但是圆方树是看yyb的博客学的,他在里面讲一下作为一个引子,所以也来写一下. 首先来Ta ...
- Servlet接口和web.xml配置文件初识
一.Java Web核心Servlet 1.什么是Servlet? Servlet是运行在服务器端的Java小程序,是sun公司提供的一套规范,用来处理客户端请求.响应给浏览器的动态资源.但Servl ...
- python基础:8.正则表达式
1.概念 正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符.及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串”用来表达对字符串的一种过滤逻辑. re模块的常见方法: ...
- 3.自定义返回json格式的数据给前台(自定义Controller类中的Json方法)
在mvc的项目中,我们前台做一些操作时,后台要返回一些结果给前台,这个时候我们就需要有一个状态来标识到底是什么类型的错误, 例如: 执行删除的时候,如果操作成功(1行受影响),我们需要返回状态为1并输 ...
- DB事务隔离级别
原创转载请注明出处:https://www.cnblogs.com/agilestyle/p/11393417.html 事务隔离级别 Note: Oracle默认的隔离级别是 READ COMMIT ...
- Struts2基础-1- 简单java类实现Action控制器
Strut2中,Action可以不继承任何特殊的类或不实现任何特殊的接口,可以只编写一个普通的Java类作为Action类,只要该类含有一个返回字符串的无参的public方法即可!实际开发中,通常继承 ...
- 企业打开云HBase的正确方式,来自阿里云云数据库团队的解读
一.HBase的历史由来 HBase是一个开源的非关系型分布式数据库(NoSQL),基于谷歌的BigTable建模,是一个高可靠性.高性能.高伸缩的分布式存储系统,使用HBase技术可在廉价PC Se ...
- linux0.11内核源码——进程各状态切换的跟踪
准备工作 1.进程的状态有五种:新建(N),就绪或等待(J),睡眠或阻塞(W),运行(R),退出(E),其实还有个僵尸进程,这里先忽略 2.编写一个样本程序process.c,里面实现了一个函数 /* ...