微信小程序：开发前你需要知道的三件事 前言 微信之父张小龙在年初的演讲中说道：“我做了多年程序员，我觉得我们应该为开发团队做点什么。”几个月后，微信正式上线了微信小程序（即微信小程序），在互联网上掀起了又一波热潮。于是，很多人都准备开发微信小程序。如果真的想开发小程序，那么必须先学习一套微信专属的“开发语言”。要想上手这门开发语言，你必须要知道以下三件事： 语言与文件 微信小程序与其他平台开发最大的不同，就是微信所采用的开发语言和文件非常“个性化”。 小程序使用的程序文件类型大致可以分为以下几类： WXML（微信标记语言） WXSS（微信样式表） JS（小游戏主体） 从语言上来说，微信小程序好像重新定义了一套标准。 但其实它们和“前端三件套”（HTML，）区别不大。 快来看看微信小程序开发语言和“前端三件套”的相同点和不同点。 界面构建 1.基础逻辑 WXML和WXSS都是小程序界面元素声明和样式描述文件。 WXML最大的特点就是以视图（View）的方式把界面元素连接起来，通过程序逻辑（）把信息更新实时传递到视图层。

View 类似于 HTML 中的 div 元素，在构建时，View 可以嵌套多层，View 中可以放置任何可视化元素，需要注意的是，元素一旦超出屏幕，用户就看不到了，这是和 HTML 的一大区别。小程序是专门用来滚动的 View，如果希望界面是可自由滚动的界面（比如列表等），可以使用 -view 图，在 WXSS 中将其大小调整为整个屏幕，并将 -y（上下滚动）或 -x（左右滚动）设置为 true。需要注意的是，小程序中不能直接使用 DOM 来控制 WXML 元素，如果需要更新数据，必须使用 WXML 提供的数据绑定和元素渲染方法。还有一点，小程序的网格排版体系采用的是 Flex 布局，这是 2009 年提出的排版标准。 2. 绑定数据 对于单个字段，开发者可以使用数据绑定的方式来更新信息。 除了在加载时更新绑定的数据外，还可以以函数的形式在JS主程序中更新，更新也可以体现在界面上绑定的数据上。 3.条件渲染与列表（循环）渲染 条件渲染适用于有意外提示的页面（比如列表或详情加载不上去时的提示等），它的渲染有触发条件，即满足条件才渲染页面，否则忽略或渲染另一端代码。两个花括号里包含的判断条件中的变量是在主程序JS代码中的数据里声明的。

把同一个元素的渲染代码集合起来，可以将循环的数据以数组的形式写入data供WXML访问，渲染完成后，渲染判断条件的变化可以影响界面的变化。 4.模板与引用 WXML支持使用模板与引用来减少代码大小。模板是WXML代码中复用同一段代码的一种方法，可以将多个模板写入同一个文件，并在其他文件中引用，如果需要整个页面都引用，就要使用。 5.样式 通过WXSS的样式表，开发者可以在WXML中定义元素样式，WXSS和CSS代码一样，可以直接使用选择器来选择元素，在WXML中也可以直接在WXSS文件中定义元素的id和样式定义。 6.用户操作与事件响应 由于微信并没有使用HTML，所以无法通过添加超链接（a元素）来检测用户点击事件，对于需要监听点击事件的元素，在WXML中应该使用属性或者进行绑定。 除了单击，微信还提供了长按、开始触摸、释放等事件响应，在 WXML 中绑定事件后，就可以在主程序中使用了。其他 API 中也有对应的事件，可以参考微信小程序官方文档。在小程序中需要跳转页面时，可以使用 wx.() 方法。

注意微信限制页面层级跳转为5级，开发时务必不要超过相应的限制。 网络请求方式 网络访问 小程序支持三种请求方式：HTTP连接、文件收发连接。 HTTP连接：请求完直接返回结果，连接结束； 连接：持久性连接，当一方主动关闭连接时，连接结束； 文件收发连接：顾名思义，在文件传输过程中发生连接。（录音、选图都需要这个连接才能完成）。 注意通过小程序访问网络需要服务器必须支持连接，端口必须为443，同时小程序只能访问开发者在注册小程序时设置的服务器地址。 开发语言与“前端三件套”异同 HTML与WXML： 两者区别较大，如果之前没有接触过开发，可能会感觉有些头疼，其实WXML在开发中更像是一个界面XML描述文件，适用于程序界面的构建； 而HTML则偏向于文章的展示（这个和HTML的历史有关）和互联网页面的构建。 WXSS与CSS：这两者在语言上几乎没有区别，可以直接使用。 JS文件：小程序的JS文件和前端开发使用的JS几乎一致，只不过小程序的JS增加了一些微信API接口，去掉了一些不必要的功能（比如DOM）。

从愿景上来说，小程序完全与学习成本最低的前端开发对接，但这并不意味着所有的开发者都可以无缝迁移。如果你是从前端开发转行到小程序，要注意这两点：1、HTML 和 WXML 文件的构建思路差别较大，如果之前只接触过前端开发，需要一段时间适应 WXML 的编写方式。2、小程序虽然用到了前端语言，但并不代表你可以继续用同样的开发思路进行开发。小程序对前端开发的要求已经从【构建界面】升级到了【开发完整应用】，前端开发需要意识的转变。