比如:如果在微信小程序中要遍历输出 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. 搞懂ES6的import export

    引言 说来惭愧,这两个关键字几乎天天在写,但是自己写的模块export出去的对象,import居然拿不到,也是没谁了

  2. [Jenkins]IOS构建机配置记录

    ------------------- 如需转载,请注明出处 ------------------- 随着业务量和开发人员的递增,IOS构建每天都会排队,影响研发效率.随购买了新的垃圾桶,进行配置. ...

  3. Redux 实现过程的推演

    这是一篇浅入浅出的 Redux 实现过程的推演笔记!正常来说应该是要从源码下手开始解析,这里是逆向推演,假如有需求是要这么一个东西,那么该如何从零开始实现? 通过该笔记,更多的是希望自己能够多熟悉从无 ...

  4. final,finally,finalize有什么区别?String, StringBuffer, StringBuilder有什么区别?Exception和Error有什么区别?

    继上篇JVM学习之后,后面将分三期深入介绍剩余JAVA基础面试题,每期3题. 题目一.final,finally,finalize有什么区别? /*请尊重作者劳动成果,转载请标明原文链接:*/ /* ...

  5. Spark学习(一)

    一.启动Spark 1.standalone模式 方法一: (1)启动主节点 ./sbin/start-master.sh 访问http://127.0.0.1:8080,得到如下页面 注意标记到的链 ...

  6. C# XML入门

    什么是XML? XML:可扩展标记语言. XML的作用: 纯文本,兼容性强. 和HTML的区别: xml: 主要用来处理.存储数据.无规定标签,可扩展. html:对数据的显示和描述. 语法标签固定. ...

  7. spring_07使用spring的特殊bean、完成分散配置

    一.   前言   分散配置思路:创建properties文件,添加数据,在beans文件中先配置properties文件,再在bean中使用占位符引用数据 对于bean的生命周期中的很多处理接口,处 ...

  8. JSJ—案例谈面向对象

    有人告诉我那里遍地都是对象——我们把所有的程序代码放在main()里面,事实上,那根本就不是面向对象的做法,在Java的面向对象中,我们也会看到类和对象的不同,以及对象是如何让你的生活更美好(至少程序 ...

  9. JS经典题目解析

    此次列举出一些觉得有意思的JS题目(来源于出了名的44题),相信有非常多关于这些题目的博客,写这篇博客的目的在于巩固一些知识点,希望能和读者共同进步. 1. map函数执行过程 ["1&qu ...

  10. Chrome开发者工具Debug入门

    译者按: 手把手教你摆脱console.log,掌握高级的debug方法. 原文: Learn How To Debug JavaScript with Chrome DevTools 译者: Fun ...