小程序语言学习 第1篇
首先要去看下官方文档 我会在课程里把一些常用的属性带大家认识一遍。
先教大家一个在wxml页面里快速创建100行view代码的快捷方式 输入 view{$}*100 然后回车键，就可以在页面里快速创建100行view了。
效果图如下： 其实这是借助我们css的 :nth-child知识点，如上图所示:nth-child(2n)就是设置偶数行，:nth-child(1n)就是设置奇数行。
主要是借助scroll-view的scroll-top属性，我会在视频里手把手的教大家实现这个功能的
主要是借助scroll-view的scroll-into-view属性，我会在视频里手把手的教大家实现这个功能的 注意事项：如上图所示，我们需要给每个条目设置一个id，并且这个id不能是数字开头。 对应的js代码如下：
小程序语言学习 第2篇
我们在学习后面课程之前，先来学习下注释。注释是在代码里给予提示使用的，主要是让别人更快的熟悉你的代码，也方便后期自己看自己的代码，快速回忆起来使用的。 — 注释有快捷键的 —
函数的两种使用方式如下图：
我们获取用户输入会用到bindinput事件，其实我们在学习input组件时，官方有给出这个属性的。 看官方的文档，可以知道bindinput主要是为了获取用户的输入内容。 bindinput的定义如下图。 在wxml里定义好bindinput事件以后，在js页面再定义一个和事件名一样的函数即可。视频里会作详细讲解。如果你有买老师的课程，或者购买老师的年卡，可以获取对应的学习视频。
小程序语言学习 第3篇
我们的项目开发多多少少的都会用到用户的一些信息，比如头像，昵称，性别等。而这些信息的获取，小程序也为我们提供好了方法。
对应的文档：
使用这个方法可以获取如下的用户信息
有的同学用这个方法时，不会弹起上面的弹窗，有可能是因为基础库版本太低，这里建议升级到最新版的基础库。
等下视频课程里会带着大家一起敲代码，这里先把一些核心代码贴出来。其实核心代码官方文档里有提供的。 这里为了方便日后大家使用，我贴出来给到大家。这里要注意 desc必须保留，里面的描述尽量写的规范些。因为
其实这里倒是挺简单，重点知识只有一个圆形图片的实现这里只需要一个image组件和一个text组件即可。通过css的border-radius就可以来设置圆形图像了，我小程序基础里也有讲过的，核心代码如下。
这里缓存我们主要用到了 对应的官方文档：
如下图所示，就是我们的本地缓存数据
对应的官方文档：
我这里把wxml和js的完整代码贴出来给到大家
我会在视频里带大家做具体代码的编写。 《小程序入门》
小程序语言学习 第4篇
上面第二步已经安装好开发者工具了，接下来就来教大家如何创建一个最简单的小程序
名字可以随便取，我这里习惯取小石头
这里需要注意下，小程序官方最新的开发者工具有了变化，所以你创建项目时如果不长下面这样。可以跳过这个图片，看下面新版的
下面这个是微信小程序23年的创建方式，也不是最新的。最新的可以跳过这个去看下一个图片
小程序最新版创建项目示例图。第五步很重要，一定要记得选择不使用模板。
配置好以后，点新建，即可创建属于自己的第一个小程序，然后创建会有一个过程，耐心等待即可。
主要给大家讲一些个性化的配置 我们可以配置主题颜色，模拟器位置，这些完全可以根据个人喜好进行设置。
下图是程序目录，每一个我都给大家标注出来了，大家前期不用死记硬背，后面开发学习过程中，用的多了， 自然就记住目录下每个文件的作用了。
小程序语言学习 第5篇
数组就是一组数据的集合，可以把更多的数据存储在单个变量下。 数组里面可以存储各种类型的数据。 如： var names=[‘编程小石头’,16,true]
明显看到第二种创建数组的方式比第一种更简洁，所以以后我们创建数组就用第二种方式
我们获取数组元素是通过数组下标来获取的，下标也叫做索引，数组的下标是从0开始的。如下图 数组可以通过下标来访问，设置，修改对应的元素值。我们可以通过 数组名[下标] 的方式来获取数据中的元素。 如 names[0]就可以获取names数组里的第一个元素‘编程小石头’
前面我们已经学完如何遍历数组了，如果我这里让大家去求下数组里所有元素的和以及平均值，大家知道如何去求吗。
var nums=[1,2,3,4] 这个数组我们很明显就可以看出来4是数组里的最大值，但是如果我们数组里的元素有很多，这个时候你就未必能很快的找出来最大值了，所以我们要想求数组里的最大值，要让代码去实现，而不是你肉眼去看。
push() 方法可向数组的末尾添加一个或多个元素，所以我们一般给数组追加元素的时候，直接使用push方法就可以了。
如我们想把数组中的指定元素删除掉，可以用一个新的数组来接受符合要求的元素，不符合要求的元素不接收，这样就可以实现删除数组元素的效果
小程序语言学习 第6篇
我们正常创建的默认项目是一个单页面，我们要想实现下面效果所示的多页面就要借助tabBar来实现多页面。
官方文档：
一个小程序可以配置2-5个多页面， 我们这里以创建3个页面来给大家做下讲解。
我们要使用tabBar就需要用到图标，所以我们要创建一个放图标的目录。 然后把我提前给大家准备好的图标放到image里即可。 这些图标我会在配套学习资料里给到大家。
关于小程序里页面的快速创建我小程序基础里讲过很多遍了，这里就不再啰嗦，直接在里创建下面三个页面即可
上面三个页面创建好以后，我们就可以通过tabBar来设置多页面布局了。 在里添加如下配置。 这样我们就可以实现可以自由切换的多页面小程序了。 到这里我们的多页面项目就创建好了。
由于这里的tabbar配置基本上是固定的，我这里把代码贴在笔记里，大家以后用到的时候，只需要把笔记里的这段代码拿过去就可以，里面的配置稍微改下既可以。
小程序语言学习 第7篇
微信⼩程序，简称⼩程序，英⽂名 Mini Program Mini Program ，是⼀种不需要下载安装即可使⽤的应⽤，它实现 了应⽤“触⼿可及”的梦想，⽤⼾扫⼀扫或搜⼀下即可打开应⽤
通过小程序和app的使用步骤，更容易看出来 可以看出小程序和app使用相比：免安装，免注册，免卸载。正如张小龙所说“随用随走”
通过腾讯2020年财报可以看出，2019年上线小程序已经超过100万个，小程序日活也已经突破4亿 2019年小程序带动就业536万个，所以我们不管是学习小程序开发，还是学习小程序运营，都有很广的就业前景。
截至2024年第一季度，微信小程序的日活跃用户数已经超过了6亿，并且使用时长也超过了朋友圈。这表明微信小程序在微信生态系统中扮演着越来越重要的角色，成为商业活动的重要载体。此外，腾讯公司2024年第一季度的财务报告显示，微信及WeChat的合并月活跃账户数量已接近14亿，具体数字为亿，同比增长3%。这进一步凸显了微信在社交媒体领域的领先地位，同时也反映了用户对微信的依赖程度正在持续加深。
在商业化方面，小程序总用户使用时长同比增长超过20%，非游戏类小程序的日均使用次数同比实现双位数百分比增长，小游戏流水同比增长30%。
这些数据表明，微信小程序不仅在用户中广受欢迎，而且在商业交易和内容创作方面也发挥着越来越重要的作用，成为品牌和商家数字化经营的重要工具。
我们上面了解完小程序的优势和历史以后，就知道我们为什么要学习小程序了
小程序语言学习 第8篇
同时，为了更好地适应微信小程序的开发需求，WXSS 对 CSS 进行了扩充以及修改。其中，与 CSS 相比，WXSS 扩展的特性主要有尺寸单位和样式导入。
在尺寸单位方面，WXSS 引入了 rpx（responsive pixel）。例如在 iPhone6 上，屏幕宽度为 375px，共有 750 个物理像素，此时 750rpx = 375px = 750 物理像素，1rpx = = 1 物理像素。规定屏幕宽为 750rpx，可以根据屏幕宽度进行自适应，这为开发者在不同屏幕尺寸的设备上进行开发提供了便利。开发微信小程序时，设计师可以用 iPhone6 作为视觉稿的标准，但在较小的屏幕上可能会不可避免地出现一些毛刺，所以在开发时需要尽量避免这种情况。
在样式导入方面，WXSS 使用 @import 语句可以导入外联样式表，@import 后跟需要导入的外联样式表的相对路径，用 “;” 表示语句结束。这种方式使得代码更加模块化，便于管理和维护。
总的来说，WXSS 作为微信小程序的样式语言，在继承 CSS 特性的基础上进行了创新和扩展，为微信小程序的界面设计提供了强大的支持。
（一）响应式像素特性
WXSS 新增的 rpx（responsive pixel）尺寸单位是其一大特色。它可以根据屏幕宽度进行自适应，为开发者在不同设备上呈现一致的界面效果提供了便利。以 iPhone6 为例，其屏幕宽度为 375px，共有 750 个物理像素，此时 750rpx = 375px = 750 物理像素，即 1rpx = = 1 物理像素。规定屏幕宽为 750rpx，使得开发者在设计小程序界面时，可以以一个相对统一的标准进行布局，而无需过多考虑不同设备的屏幕尺寸差异。这种响应式的特性使得小程序在各种设备上都能保持良好的显示效果。
（二）样式外联
在 WXSS 中，可以通过 @import 语句导入外联样式表。用法非常简单，@import 后跟需要导入的外联样式表的相对路径，用 “;” 表示语句结束。例如，首先在 page 文件下新建一个文件为 style，并写一个样式文件 ，然后在需要导入的文件的 wxss 文件中使用 @import_../style/_ 即可。但这种方式也有一定的限制，需要注意目录层次问题，确保相对路径的准确性。这种样式外联的方式使得代码更加模块化，便于管理和维护不同页面的样式。
（三）内联样式
WXSS 在框架组件上支持使用 style、class 属性来控制组件的样式。style 属性接收动态的样式，在运行时会进行解析，所以通常用于动态样式的设置。但不要将静态的样式写进 style 中，以免影响渲染速度。而 class 属性用于指定样式规则，其属性值是样式规则中类选择器名（样式名）的集合，样式类名不需要带上 “.”，样式类名之间用空格分隔，通常用于静态样式的统一管理。
（四）选择器丰富
WXSS 目前支持多种选择器，为开发者提供了丰富的样式控制手段。比如元素选择器，使用元素名称作为选择器，选取匹配的元素，如使用 “view” 选择器可以选取所有的 “view” 组件；类选择器，使用类名作为选择器，选取具有特定类名的元素，如 “.classname” 选择器可以选取具有 “.classname” 类名的元素；ID 选择器，使用元素的 ID 作为选择器，选取具有特定 ID 的元素，如 “#idname” 选择器可以选取具有 “idname” ID 的元素；伪类选择器，用于选择元素的特定状态或位置，如使用 “:hover” 选择器可以选取鼠标悬停在元素上的状态；子元素选择器，使用 “>” 分隔两个选择器，表示选取第一个选择器的直接子元素；属性选择器，使用元素的属性值作为选择器，选取具有特定属性值的元素；后代选择器，使用空格分隔两个选择器，表示选取第一个选择器的后代元素；通配选择器，使用 “*” 作为选择器，表示选取所有元素。在优先级方面，通常 ID 选择器优先级较高，类选择器次之，元素选择器优先级相对较低。但具体的优先级还会受到样式的层叠和继承关系的影响。
（一）尺寸单位不同
WXSS 引入了 rpx（responsive pixel）单位，这是一种可以根据屏幕宽度进行自适应的单位。例如在 iPhone 6 上，屏幕宽度为 375px，共有 750 个物理像素，此时 1rpx 等于 或 1 物理像素。而 CSS 则支持多种长度单位，如 rem、em、vh、vw 等，这些单位需要手动进行换算。相比之下，WXSS 的 rpx 单位在微信小程序开发中更加便捷，能够自动适应不同屏幕尺寸的设备，减少了开发者手动换算单位的工作量。
（二）样式定义和应用差异
WXSS 提供了全局样式和局部样式之分。全局样式定义在 中，会作用于所有小程序页面；局部样式定义在页面的 wxss 文件中，仅会作用于当前页面，并可能覆盖全局页面的样式（遵循就近原则）。而 CSS 没有直接的全局和局部样式之分，但可以通过将样式定义在 HTML 文档的 header 部分或专门的 CSS 文件中，并在 HTML 页面中引用，来实现样式的统一管理和应用。这种差异使得 WXSS 在小程序开发中能够更加灵活地控制不同页面的样式，同时也便于实现样式的复用。
（三）选择器支持不同
WXSS 仅支持部分 CSS 选择器，包括.class、#id、element、并集选择器、后代选择器、::after 和::before 等伪类选择器。相比之下，CSS 则支持更广泛的选择器，如属性选择器、子元素选择器、相邻兄弟选择器等。这些选择器为 CSS 提供了更强大的样式定制能力，而 WXSS 在选择器的支持上相对较为有限。这也意味着在微信小程序开发中，开发者需要更加谨慎地选择合适的选择器来实现所需的样式效果。
（四）组件和属性支持有别
WXSS 针对微信小程序的组件进行了样式支持的优化，一些样式属性在小程序中有特殊的表现，如 flex 布局在微信小程序中得到了更好的支持。而 CSS 主要针对标准的网页元素和布局进行支持，虽然也支持 flex 布局等现代 CSS 特性，但在小程序中的表现可能与 WXSS 有所不同。这种差异使得开发者在开发微信小程序时，需要更加熟悉 WXSS 对小程序组件的样式支持特点，以便更好地实现页面的布局和设计。
（五）样式继承区别
WXSS 不支持样式的继承，每个元素的样式需要单独定义。而 CSS 支持样式的继承，子元素可以继承父元素的样式，这有助于减少重复的代码并提高样式的可维护性。在微信小程序开发中，由于 WXSS 不支持样式继承，开发者需要更加注意每个元素的样式定义，避免重复定义相同的样式。而在网页开发中，CSS 的样式继承特性可以提高开发效率，减少代码量。
（一）微信小程序开发必备
WXSS 是微信小程序开发的最佳伴侣，适用于各种小程序开发场景。在微信小程序的开发过程中，WXSS 为开发者提供了强大的样式控制能力，使得小程序的界面更加美观、专业。无论是简单的信息展示类小程序，还是复杂的电商、社交等类型的小程序，WXSS 都能发挥重要作用。例如，在电商小程序中，通过 WXSS 可以精确地控制商品展示页面的布局和样式，使商品信息更加清晰地呈现给用户。同时，WXSS 的响应式设计特性能够确保小程序在不同尺寸的设备上都能有良好的显示效果，提升用户体验。
（二）企业级应用
对于公司或组织内部小程序，WXSS 可快速建立专业一致的界面风格。企业级应用通常对界面的专业性和一致性有较高要求，WXSS 正好满足这一需求。通过使用 WXSS，可以为企业内部小程序定制统一的主题和样式，使其与企业的品牌形象保持一致。例如，一个大型企业的内部办公小程序，可以利用 WXSS 打造简洁、高效的界面风格，提高员工的工作效率。同时，WXSS 的易于定制特性使得企业可以根据自身需求随时调整小程序的界面风格，满足不同阶段的业务需求。
（三）个人开发者利器
表明无论是新手还是经验丰富开发者，WXSS 简单易用的组件库可节省大量设计和编码时间。对于个人开发者来说，时间和资源往往有限。WXSS 的简单易用性使得个人开发者能够快速上手，无需花费大量时间学习复杂的样式语言。例如，新手开发者可以利用 WXSS 的内联样式和样式外联功能，快速为自己的小程序添加个性化的样式。而经验丰富的开发者则可以利用 WXSS 的丰富选择器和响应式设计特性，打造更加复杂、专业的小程序界面。此外，WXSS 的文档齐全，每个组件都配有详细的使用说明和示例代码，便于个人开发者学习和参考。
（一）环境准备与项目结构
要学习 WXSS，首先需要进行环境准备。获取 APPID 可登录微信公众平台，在主页的 “开发”→“开发管理”→“开发设置”→“开发者 ID” 中找到并复制 AppID。下载微信开发者工具，可从官方网站获取。
小程序与传统 web 文件结构相比，微信小程序是四层结构，多了一层配置.json。基本的项目目录通常包括 、、 文件，定义小程序的一些全局配置。小程序所有的页面文件都在 pages / 路径下，页面文件有四种文件类型，分别是.js、.wxml、.wcss、和.json 后缀的文件。相比全局配置文件，页面配置文件只对当前页面生效。
（二）配置文件 JSON
全局配置 ： 是当前小程序的全局配置，包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。例如，pages 字段用于描述当前小程序所有页面路径，让微信客户端知道小程序页面定义在哪个目录；window 字段定义小程序所有页面的顶部背景颜色、文字颜色定义等。
页面配置 ：页面级别的.json 配置文件可以实现对小程序页面特殊的窗口表现需求，页面中配置项会覆盖 的 window 中相同的配置项。
sitemap 配置：小程序根目录下的 文件用于配置小程序及其页面是否允许被微信索引。
（三）模板语句 WXML
基本用法：WXML（WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。例如，text 相当于以前 web 中的 span 标签，view 相当于以前 web 中的 div 标签。
逻辑运算：可以在花括号中加入表达式，如数字运算、字符串拼接、三元表达式等。
列表循环：wx:for 用于列表循环，可以指定循环项的名称和索引，同时需要注意 wx:key 的使用来提高列表渲染性能。
条件渲染：根据特定条件显示或隐藏组件。
常见组件包括 view、text、image、swiper、navigator、rich-text、button、icon、radio、checkbox 等。每个组件都有特定的用途和属性，可以根据需求进行灵活运用。
（四）样式列表 WXSS
尺寸单位：WXSS 扩展了尺寸单位，如 rpx（responsive pixel）。在不同尺寸设备上，rpx 可以根据屏幕宽度进行自适应，为开发者提供了便利。
样式导入：使用 @import 语句可以导入外联样式表，使代码更加模块化，便于管理和维护。
导入 less：可以通过特定的方式导入 less 文件，进一步增强样式的可维护性和可扩展性。
（五）自定义组件与生命周期
自定义组件：可以创建自定义组件，提高代码的复用性。创建自定义组件需要在特定的目录下进行声明和实现，然后在需要使用的地方进行引入。
小程序和页面的生命周期：小程序有应用生命周期和页面生命周期。应用生命周期包括 onLaunch、onShow、onHide 等阶段；页面生命周期包括 onLoad、onShow、onReady、onHide、onUnload 等阶段。了解这些生命周期有助于更好地管理小程序的状态和行为。
小程序语言学习 第9篇
对象只是一种特殊的数据。对象是一组无序的相关属性和方法组成。这里重点要记住属性和方法这两个新概念
例如： 石头哥具备姓名，年龄，身高，体重等属性 石头哥具备写代码，唱歌，骑车，跑步，吃饭等行为。
我们在保存一个数据时，可以用变量，保存多个数据时可以用数组。但是我如果想保存一个完整的立体的信息时呢。
但是我们如果用对象来保存这些信息呢
这样我们是不是就可以立体的知道每个数据代表什么意思了呢。这也是我们使用对象的原因。上面的{}里包裹的就是我们对象的一些属性。只不过我们的属性名不提倡用汉字，应该用英文或者拼音，我这里方便大家理解才这样写的。
语法如下 var 对象名={ 属性名：属性值， 属性名：属性值， 方法名：function(){} }
示例如下：
语法： var obj = new Object(); ‘编程小石头’ 我们这里就是先用 new Object()创建一个空对象，然后通过.属性名给这个空对象添加属性和方法
构造函数是一种特殊的函数，主要用来初始化对象，它总是和new运算符一起使用，我们可以把对象里的一些公共属性和方法抽取出来，然后封装到这个函数里，方便批量创建对象。
使用构造函数创建对象时要注意下面几点
完整实例如下：
构造函数和对象 我们这里的构造函数就好比汽车的设计图纸，汽车具备哪些属性，拥有哪些方法，已经提前在图纸上设计好了，我们只需要根据图纸new出来一个对象，比如可以new出来一个宝马车，也可以new出来一辆兰博基尼。
如上面我们通过构造函数new一个对象
这里在new一个对象出来时会执行下面四件事
属性和变量:
函数和方法：
对象属性的调用语法有两种
如我们对象如下
调用name属性就是 这里obj就是我们的对象，name就是我们的对象的属性，里的.就相当于 的 翻译过来就是obj的name 另外一种调用属性的方式就是 obj[‘name’]
对象中方法的调用就一种方式：对象名.方法名() 这里的这对小括号是必不可少的。 如我们对象如下
() 就是直接调用obj里的code方法
小程序语言学习 第10篇
上一节变量的学习，我们知道变量是用来装数据的盒子，可是数据有很多，有各种各样的类型。不同类型的数据占用的计算器内存也不一样。就好比胖子睡大床，瘦子睡小床就行。 在计算机中不同的数据占用的存储空间是不同的，为了便于区分，充分利用存储空间，于是就定义了不同的数据类型。 简单来说，数据类型就是数据的类别型号，比如“张三”是个人名，18是个数字
我们的数据类型可以分成下面两大类
js数字类型的数据，既可以是整数，也可以是小数(浮点数)
用引号或者双引号包起来的都是字符串类型，如 “编程小石头”，‘石头哥’都是字符串。字符串和羊肉串有点像，羊肉串是用竹签把羊肉一串串的串起来。字符串就是把字符串起来。
上面代码的age1和age2是有区别的，age1的18被双引号包裹着，所以是字符串，age2就是一个数字18，所以是数字型。这也进一步说明了，只要是被单引号或者双引号包裹着的都是字符串类型。
字符串是由若干字符组成的，这些字符的数量就是字符串的长度，通过字符串的length属性可以获取整个字符串的长度。 还是拿羊肉串来类比，比如你一个羊肉串上串了5块羊肉，那么这个羊肉串的长度就是5。 使用的语法如下
多个字符串之间可以使用 + 进行拼接，其拼接方式为 字符串+字符串=拼接之后的新字符串。 语法如下：
上面的12+12=24，“12”+12=“1212” 这就告诉我们字符串加任何类型的数据，拼接后的结果都是字符串。
布尔类型有两个值：true和false，其中true表示真，false表示假。
一个声明后没有赋值的变量会有一个默认值 undefined 一个声明变量，并且赋值null，就代表这个变量是空值(学习object对象时，我们会继续研究null) null 和 undefined 的值相等，但类型不同，下面的8-7会有代码演示
typeof 操作符用来检测变量的数据类型
打印null和undefined的数据类型如下
注意：这里的 == 用来判断值是否相等，后面会讲。 上面的代码可以看出：null 和 undefined 的值相等，但类型不同
就是把一种数据类型的变量转换成另外一种数据类型，比如把字符串的 “18”转换为数字类型的18 常用的数据类型转换
转为数字的几个特殊情况
小程序语言学习 第11篇
在学习条件语句河循环语句之前，我们要先知道什么是流程控制， **流程控制：**流程控制就是来控制我们的代码按照什么顺序来执行的语句。 流程控制主要有三种结构
我们上面讲的分支结构，就是代码在从上到下的执行过程中，根据不同的条件，执行不同的代码，从而得到不同的结果。分支结构常用的语句就是条件语句. 我们常用的分支结构的语句:
条件语句: 用于基于不同条件执行不同的动作,通常在写代码时，您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。 举个最简单的例子：你满18岁就可以去网吧，不满18岁就不允许进网吧。这里的判断条件就是你的年纪。 我们这里常用的就是if条件语句，所以接下来我们会重点讲解下if条件语句。
在 JavaScript 中，我们可使用以下条件语句：
使用 if 语句来规定假如条件为 true 时被执行的 JavaScript 代码块。
如果年龄小于18岁，就输出未成年
使用 else 语句来规定假如条件为 false 时的代码块。
如果年龄小于18岁，就输出未成年，否则就输出成年
使用 else if 来规定当首个条件为 false 时的新条件。
如果年龄小于18岁，就输出未成年，年龄大于18岁小于60岁就输出成年，年龄大于60岁就输出老年。
在wxml中，使用 wx:if=“” 来判断是否需要渲染该代码块：
也可以用 wx:elif 和 wx:else 来添加一个 else 块：
可以看出wxml里的条件渲染和我们上面讲的if条件语句类似，只是写法上稍微有些区别。 wxml里的条件渲染主要用来做页面展示和隐藏使用的。
如果您希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的。 比如我们想输出5编编程小石头
上面实例中 语句1：var i=0 是在开始执行前初始化变量i 语句2:i<5 是用来判断i是否小于5，如果小于5就继续执行循环 语句3：i++ 是在每次循环执行一遍后对i进行加1的操作
在wxml里我们使用wx:for来显示列表数据。 在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。 默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item
在js里定义的列表数据如下
continue和break都是用来终止循环的，区别在于