微信小程序示例使用到了大量的for+i+function+function组合代码到底怎么理解
在微信小程序示例代码里面使用到了非常多的for+i+function+function这种组合代码，有时看了头晕，到底是什么意思？起什么作用或者说解决什么问题？它跟javascript的closure(闭包)有什么关联？今天我们就来学习一下它。
下面使用一个作为例子：
var toastNum = 3
var pageData ={}
pageData.data ={}
=0; i &= toastN ++i) {
pageData.data['toast'+i+'Hidden'] =
(function (index) {
pageData['toast'+index+'Change'] =
function(e) {
var obj = {}
obj['toast'+index+'Hidden'] =
this.setData(obj)
pageData['toast'+index+'Tap'] =
function(e) {
var obj = {}
obj['toast'+index+'Hidden'] = false
this.setData(obj)
Page(pageData)
这段代码来自微信小程序示例代码: page/component/component-pages/wx-toast/wx-toast.js
这段代码的代码的主要意思是通过一个for循环，把object对象pageData里的object变量data的toast0Hidden,toast1Hidden,toast2Hidden,toast3Hidden变量赋值都赋值成true，把object对象pageData里toast0Change,toast1Change,toast2Change,toast3Change变量分别赋值一个匿名回调函数，此回调函数如下：
function(e) {
var obj = {}
obj['toast'+index+'Hidden'] =
this.setData(obj)
把object对象pageData里toast0 Tap,toast1 Tap,toast2C Tap,toast3Tap变量分别赋值一个匿名回调函数，此回调函数如下：
function(e) {
var obj = {}
obj['toast'+index+'Hidden'] = false
this.setData(obj)
但是为什么for循环里面还有一个
(function (index) {
这样的东西呢？是不是多此一举，让代码复杂化，能不能去掉，如果不是不能，哪又起什么作用呢？
为了理解这个东西，我们先学习一点点javascript的作用域的知识
在javascript的世界里，只有全局作用域和函数作用域，没有块作用域，那么什么是全局作用域，什么又是函数作用域呢？全局作用域就是在全局范围都起作用的一些，其中囊括在函数之外定义的变量和函数内没有声明为var的变量，如果上面的toastNum，pageData，特别指出的是i它也是，而函数作用域就是在函数以内的作用范围，包括参()，函数体{}内，比如上面代码的var
obj={}中的obj和函数参数index。
为了看到效果，我们把去掉，调整代码如下:
for(var i = 0; i&= toastN ++i) {
pageData.data['toast'+i+'Hidden'] =
pageData['toast'+i+'Change']= function(e) {
var obj = {}
obj['toast'+i+'Hidden'] =
this.setData(obj)
pageData['toast'+i+'Tap'] = function(e) {
var obj = {}
obj['toast'+i+'Hidden'] = false
this.setData(obj)
调试时看变量初始化，好像都正常，该有的都有了
那咱们继续，点击界面上其中的某个按钮，调试结果：
调试的i，怎么变成4，进而形成toast4Hidden，从上上图我们知道，我们最高是3，怎么跑出4来了？哦，原来,i由于javascript里没有区块作用域，所以i现在全局作用域，并且只有一个i,当for循环完后i就变成了4,所以当回调函数使用它时就是4了，那么跟我们想的不一样，我们想的是当点击第一个btn时，就是相应的toast1Hidden，那怎么办？一种通用的就办法就引了函数作用域，就是javascript所说的closure(闭包)，就是把i当参数传入一个函数，然后被传入的函数有一个参数是用来复制保存当时的i的，如下代码:
(function (index) {
所以现在只有4个index变量(for循环以后)，复制缓存i的四个状态:0,1,2,3，而这4个index的作用是函数作用域，在上面function(){}的{}里头有效，所以就可以实现我们之前想的目标，即函数里的index是对应的。
最后代码我贴一下，大家自己去体会下之间的不同：
Js文件代码:
var toastNum = 3
var pageData ={}
pageData.data ={}
for(var i = 0; i&= toastN ++i) {
pageData.data['toast'+i+'Hidden'] =
(function (index) {
pageData['toast'+index+'Change'] =function(e) {
var obj = {}
obj['toast'+index+'Hidden'] =
this.setData(obj)
pageData['toast'+index+'Tap'] = function(e){
var obj = {}
obj['toast'+index+'Hidden'] = false
this.setData(obj)
Page(pageData)
Wxml文件代码：
&viewclass="page"&
&view class="page__hd"&
&textclass="page__title"&toast&/text&
&textclass="page__desc"&toast提示&/text&
&view class="page__bd"&
&view class="btn-area"&
&view class="body-view"&
&toasthidden="{{toast1Hidden}}" bindchange="toast1Change"&
&button type="default"bindtap="toast1Tap"&点击弹出默认toast&/button&
&view class="body-view"&
&toasthidden="{{toast2Hidden}}" icon="warn"bindchange="toast2Change"&
&button type="default" bindtap="toast2Tap"&点击弹出设置icon的toast&/button&
&view class="body-view"&
&toasthidden="{{toast3Hidden}}" duration="3000"bindchange="toast3Change"&
设置duration
&button type="default"bindtap="toast3Tap"&点击弹出设置duration的toast&/button&
没有更多推荐了，微信小程序开发之页面wxml里面实现循环 wx：for
时间： 21:31:32
&&&& 阅读：2996
&&&& 评论：
&&&& 收藏：0
标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&js代码：
upploadimagelist:{},&&& //上报图片列表 js数组
var uploadimageObj=JSON.parse(res.data.feedback.fbimages);& //将后台传过来的json字符串转换为js数组，res为wx.request（{}）请求成功的返回对象
wxml代码：&view wx:for="{{upploadimagelist}}" wx:key="id"&&&image class="uploadimageclass" src="{{item.fileUrl}}"&&/image&&&/view&
循环语句默认的循环变量是item，故使用item来取数据，可以说是对象也可以是某个字段，取决于upploadimagelist里面的数据有几层
&view class="listcontain" bindtap="getInfoDetial" id="{{item.id}}"&。。。&/view&&&&&&&&&&&&&&&&& //可以在视图里绑上id，配合事件getInfoDetial，可以获取到列表数据的id，对后续用id进行进一步查询或排序有着重要的意义
事件getInfoDetial写法
getInfoDetial:function(e){&&& //获取列表ID&&& var id=e.currentTarget.& wx.navigateTo({&&& url: ‘detailinfo/index?id=‘+ id,& //带参数页面跳转，在目的页面的onLoad方法里面就能取到id，进行进一步处理（比如获取该id下的详细信息）&&& success: function(res){&&&&& // success &&& },&&& fail: function(res) {&&&&& // fail&&& },&&& complete: function(res) {&&&&& // complete&&& }& })& },标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&原文地址：http://www.cnblogs.com/min-min-min/p/6869575.html
&&国之画&&&& &&&&chrome插件
版权所有 京ICP备号-2
迷上了代码！有没有知道微信小程序的，这个数组每一项就是无法循环出来，求教下 - 『编程语言讨论求助区』
- 吾爱破解 - LCG - LSG |安卓破解|病毒分析|破解软件|www.52pojie.cn
后使用快捷导航没有帐号？
只需一步，快速开始
请完成以下验证码
请完成以下验证码
查看: 1000|回复: 4
有没有知道微信小程序的，这个数组每一项就是无法循环出来，求教下
阅读权限20
发帖求助前要善用【】功能，那里可能会有你要找的答案；
求助软件脱壳或者破解思路时，请务必在主题帖中描述清楚你的分析思路与方法，否则会当作求脱求破处理；
如果你在论坛求助问题，并且已经从坛友或者管理的回复中解决了问题，请把帖子分类改成【已解决】；
如何回报帮助你解决问题的坛友，一个好办法就是给对方加【热心】和【CB】，加分不会扣除自己的积分，做一个热心并受欢迎的人。
困了挺久了，为什么在JS页面打印出来是数组的格式，但是在前台页面就是无法取出每一项，然后我试着加一个符号，怎么会把每个字符当做一项呢？麻烦知道的兄弟能指点下该怎么弄，真的弄了很久没弄出来
(149.95 KB, 下载次数: 1)
18:38 上传
(101.22 KB, 下载次数: 1)
18:38 上传
(139.48 KB, 下载次数: 1)
18:38 上传
发帖求助前要善用【】功能，那里可能会有你要找的答案；如果你在论坛求助问题，并且已经从坛友或者管理的回复中解决了问题，请把帖子分类或者标题加上【已解决】；如何回报帮助你解决问题的坛友，一个好办法就是给对方加【热心】，加分不会扣除自己的积分，做一个热心并受欢迎的人！
阅读权限10
不行，我测试了很多次也是这样子
发帖求助前要善用【】功能，那里可能会有你要找的答案；如果你在论坛求助问题，并且已经从坛友或者管理的回复中解决了问题，请把帖子分类或者标题加上【已解决】；如何回报帮助你解决问题的坛友，一个好办法就是给对方加【热心】，加分不会扣除自己的积分，做一个热心并受欢迎的人！
阅读权限20
不是json数组的形式吗
发帖求助前要善用【】功能，那里可能会有你要找的答案；如果你在论坛求助问题，并且已经从坛友或者管理的回复中解决了问题，请把帖子分类或者标题加上【已解决】；如何回报帮助你解决问题的坛友，一个好办法就是给对方加【热心】，加分不会扣除自己的积分，做一个热心并受欢迎的人！
阅读权限20
1. 你这个是数组，php&&vd 打引出来的结果是数组，2. 输出的时候用json_encode把对象变为json，js 接受的时候可以用dataType或着header规范接收的格式 3.&&两个页面的编码要一致，建议是u8 no BOM .
发帖求助前要善用【】功能，那里可能会有你要找的答案；如果你在论坛求助问题，并且已经从坛友或者管理的回复中解决了问题，请把帖子分类或者标题加上【已解决】；如何回报帮助你解决问题的坛友，一个好办法就是给对方加【热心】，加分不会扣除自己的积分，做一个热心并受欢迎的人！
阅读权限10
不懂，帮顶
发帖求助前要善用【】功能，那里可能会有你要找的答案；如果你在论坛求助问题，并且已经从坛友或者管理的回复中解决了问题，请把帖子分类或者标题加上【已解决】；如何回报帮助你解决问题的坛友，一个好办法就是给对方加【热心】，加分不会扣除自己的积分，做一个热心并受欢迎的人！
免责声明：吾爱破解所发布的一切破解补丁、注册机和注册信息及软件的解密分析文章仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。本站信息来自网络，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，购买注册，得到更好的正版服务。如有侵权请邮件与我们联系处理。
( 京ICP备号 | 京公网安备 87号 )
Powered by Discuz!
Comsenz Inc.只需一步，快速开始
后使用快捷导航没有帐号？
关注：1546
所属分类： &
本版块为微信小程序资源分享区，包括微信小程序开发中可能会用到的各类小程序开发工具、小程序demo源码及开发教程等。
快捷导航（）：、、
微信小程序for循环使用介绍
查看: 4299|回复: 4
& 主题帖子积分
新人求带, 积分 119, 距离下一级还需 381 积分
新人求带, 积分 119, 距离下一级还需 381 积分
在组件上使用wx:for控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变量名默认为index，数组当前项的变量名默认为item 事例如下：
wxml文件:
&view wx:for=&{{items}}&&
{{index}}: {{item:one}}
&/view&
js文件：
Page({
items:[{
one: &test1&,
},{
one: &test2&
}]
})复制代码
可以使用wx:for-item指定数组当前元素的变量名
可以使用wx:for-index指定数组当前下标的变量名，事例如下：
wxml文件：
&view wx:for=&{{items}}& wx:for-item=&name& wx:for-index=&id&&
{{id}}: {{name.one}}
&/view&复制代码
下面是一个九九乘法表事例：
&view wx:for=&{{[1,2,3,4,5,6,7,8,9]}}& wx:for-item=&i&&
&view
wx:for=&{{[1,2,3,4,5,6,7,8,9]}}& wx:for-item=&j&&
&view
wx:if=&{{i &= j}}&&
{{i}}*{{j}} = {{i * j}}
&/view&
&/view&
&/view&复制代码
2，block&&wx:for
wx:for用在&blcok/&标签上，以渲染一个包含多节点的结构块。例如：
&block wx:for=&{{[1,2,3]}}&&
&view& {{index}}: &/view&
&view& {{item}} &/view&
&/block&复制代码
关注我的同学（只显示前32名）
& 主题帖子积分
新人求带, 积分 98, 距离下一级还需 402 积分
新人求带, 积分 98, 距离下一级还需 402 积分
高盛目测的。。出血阶段
& 主题帖子积分
新人求带, 积分 53, 距离下一级还需 447 积分
新人求带, 积分 53, 距离下一级还需 447 积分
不错不错，支持
& 主题帖子积分
略知一二, 积分 579, 距离下一级还需 421 积分
略知一二, 积分 579, 距离下一级还需 421 积分
& 主题帖子积分
新人求带, 积分 145, 距离下一级还需 355 积分
新人求带, 积分 145, 距离下一级还需 355 积分
www.henkuai.com—微信开发者的分享交流平台，专注微信开发生态。
天津市滨海新区中新生态城中成大道生态建设公寓9号楼3层301
微信公众号微信小程序“跳一跳”游戏，跳出的许多感悟……微信小程序“跳一跳”游戏，跳出的许多感悟……暖暖辰语百家号自从微信小程序出了“跳一跳”游戏后，人们就像着了迷一样，只有有点空闲就会拿出手机玩一下，小编有一段时间也沉迷其中，无法自拔啊！生怕排在自己后面的人超过自己，但又想快点超过前面的人。不过，很多人跳着跳着就会感悟出一些道理：1、人生就像弹簧被压的越低，跳的越远；2、人生没有回头路，每一步都要深思熟虑；3、步子太大容易摔倒；胆子太小跨不过坎；4、人生没有捷径，每一步都要亲自经历；5、但也许，好运和背景可以给你加分。通过感悟，想到了一些人生语录：1、低分时胆大妄为，高分时如履薄冰；2、谨记，耐心有时比机会更重要；3、千万不要让狗屎运打乱你的节奏；4、不管走多远，每一步都是新起点；5、小心驶得万年船，人生要步步为营。看完后，再玩“跳一跳”是不是有不一样的感觉呢？继 “跳一跳”之后，微信小程序又有一个头脑王者的游戏，瞬间又让人们陷入其中，无法自拔……不得不让人感叹：这游戏真的是有毒啊~玩过后根本停不下来!!!本文由百家号作者上传并发布，百家号仅提供信息发布平台。文章仅代表作者个人观点，不代表百度立场。未经作者许可，不得转载。暖暖辰语百家号最近更新：简介:多一点新鲜事物，多一点快乐！作者最新文章相关文章