比如:如果在微信小程序中要遍历输出 0-9 的数,我们会使用for循环

for(var i=;i<;i++){
console.log(i);
}

确实结果也是这样:

但是,如果我在循环时同时调用wx的api接口10次,那么输出的结果就会不同(这是产生了闭关的效应)

eg:每次调用一次wx.showToast()接口,并在成功时输出循环的值。

for(var i=;i<;i++){
wx.showToast({
title: 'haha',
success:function(){
console.log(i);
}
})
}

结果:

可以看到输出了10次10,这是因为i自变量的作用域范围,在这里它相当于全局变量。

两种解决办法:

1.使用临时函数

 

for(var i=;i<;i++){
(function(j){
wx.showToast({
title: 'haha',
success: function () {
console.log(j);
}
})
})(i);
}

以上代码同:

for(var i=;i<;i++){
function temp(j){
wx.showToast({
title: 'haha',
success: function () {
console.log(j);
}
})
};
temp(i);
}
},

结果:

2.使用ES6中let的块作用域(推荐)

for(let i=;i<;i++){
wx.showToast({
title: 'haha',
success: function () {
console.log(i);
}
})
}

结果同上。

但是如果将let i定义在函数外部,则对于循环来说还是相当于全局变量

let i;
for(i=;i<;i++){
wx.showToast({
title: 'haha',
success: function () {
console.log(i);
}
})
}

结果还是:

微信小程序中的循环遍历问题的更多相关文章

  1. 在微信小程序中,如何获取 for 循环的 index

    微信小程序中,for 循环的 index(索引值)可以用wx:for-index="index"来获取. <view class="item" wx:fo ...

  2. 全栈开发工程师微信小程序-中

    全栈开发工程师微信小程序-中 多媒体及其他的组件 navigator 页面链接 target 在哪个目标上发生跳转,默认当前小程序,可选值self/miniProgram url 当前小程序内的跳转链 ...

  3. 微信小程序之for循环

    在微信小程序中也有for循环,用于进行列表渲染. 官方实例 打开微信开发者文档,在框架部分的视图层-->wxml-->列表渲染中可以看到官方给出的for循环实例,在实例中 可以看到下面相关 ...

  4. 网页或微信小程序中使元素占满整个屏幕高度

    在项目中经常要用到一个容器元素占满屏幕高度和宽度,然后再在这个容器元素里放置其他元素. 宽度很简单就是width:100% 但是高度呢,我们知道的是height:100%必须是在父元素的高度给定了的情 ...

  5. 在微信小程序中使用富文本转化插件wxParse

    在微信小程序中我们往往需要展示一些丰富的页面内容,包括图片.文本等,基本上要求能够解析常规的HTML最好,由于微信的视图标签和HTML标签不一样,但是也有相对应的关系,因此有人把HTML转换做成了一个 ...

  6. 微信小程序中发送模版消息注意事项

    在微信小程序中发送模版消息 参考微信公众平台Api文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html#模版消息管理 此参考地址 ...

  7. 微信小程序中placeholder的样式

    通常,现代浏览器大多支持::placeholder选择器,用于设置placeholder的样式,但是在微信小程序中并不支持这种方式,而是提供了一个专门的属性(placeholder-class)来处理 ...

  8. 微信小程序中转义字符的处理

    在微信小程序开发过程中,有时候会用到常用的一些特殊字符如:‘<’.‘>’.‘&’.‘空格’等,微信小程序同样支持对转义字符的处理,下面提供两种方法用来处理微信小程序中转义字符的处理 ...

  9. 微信小程序中用户登录和登录态维护

    提供用户登录以及维护用户的登录状态,是一个拥有用户系统的软件应用普遍需要做的事情.像微信这样的一个社交平台,如果做一个小程序应用,我们可能很少会去做一个完全脱离和舍弃连接用户信息的纯工具软件. 让用户 ...

随机推荐

  1. mysql 开发基础系列18 存储过程和函数(下)

    1. 光标的使用(游标) 在存储过程和函数中可以使用光标对结果集进行循环的处理,光标使用包括光标的声明,open ,fetch,close. 下面在存储过程中使用一个光标, 这个举例中光标里的逻辑不重 ...

  2. form详解

    form ** form常用属性 action 指定请求的地址 method 请求方式,如果是post形式发出的,表单的输入值就会放在请求体中,并且会进行编码处理,编码的方式在请求头中的Content ...

  3. 在vue项目中添加特殊字体

    这里的特殊字体,指的是一般用户电脑未安装到本地的字体,要引入这样的字体,首先需要把字体文件下载下来. 就像上图这样的,ttf格式的,然后在项目里添加它. 然后我们在font.css里用@font-fa ...

  4. java 中文乱码的解决方法

    1. 这方法行之有效,但是谨慎用,它会作用服务器.超链接中带有的中文字符,<a class="add" href = "system/showDataAdd.act ...

  5. nginx多tomcat负载均衡

    目的 先说说我要干什么,如题:使用nginx实现多个tomcat服务器的负载均衡. nginx 大名鼎鼎,相信很多人都听过,以前感觉很厉害,用了之后发现真的很厉害.nginx可以做以下几件事: 反向代 ...

  6. OnlineJudge难度与正确度的相关性检验

    本着做题的心态,上了东莞理工学院的 oj 网:在选择难度的时候发现有些题目通过率和难度可能存在着某些关系,于是决定爬下这些数据简单查看一下是否存在关系. 一.新建项目 我是用 Scrapy 框架爬取的 ...

  7. PCA实现教程

    数据是机器学习模型的生命燃料.对于特定的问题,总有很多机器学习技术可供选择,但如果没有很多好的数据,问题将不能很好的解决.数据通常是大部分机器学习应用程序中性能提升背后的驱动因素. 有时,数据可能很复 ...

  8. spring学习(二) ———— AOP之AspectJ框架的使用

    前面讲解了spring的特性之一,IOC(控制反转),因为有了IOC,所以我们都不需要自己new对象了,想要什么,spring就给什么.而今天要学习spring的第二个重点,AOP.一篇讲解不完,所以 ...

  9. Go语言学习笔记说明

    参考书籍:<学习Go语言>.<Go语言编程> 程序运行环境:windows(64bit) Go语言版本:go1.0.2   资料: 1.Go语言半小时速成教程 http://w ...

  10. 翻译:ZooKeeper OverView

    ZooKeeper系列文章:https://www.cnblogs.com/f-ck-need-u/p/7576137.html#zk ZooKeeper: 分布式协调服务 ZooKeeper是一个开 ...