微信小程序学习笔记（一）

小程序组成

一个微信小程序只有一个App实例，具体的页面放置在Pages下，每一个页面设立一个文件夹，相应的wxml、wxss、js、json放置在文件夹下。

每个App对应都有相应的wxml、wxss、js、json文件，作为一个全局的配置，每个页面则是个性化的设置。

1.json

全局的app.json中的pages字段中需要添加小程序的所有路径，其中的第一个页面为首页。JSON文件在小程序代码中扮演静态配置的作用。

JSON的Key必须包裹在一个双引号中，在实践中，编写 JSON 的时候，忘了给 Key 值加双引号或者是把双引号写成单引号是常见错误。

JSON的值只能是以下几种数据格式：

1. 数字，包含浮点数和整数
2. 字符串，需要包裹在双引号中
3. Bool值，true 或者 false
4. 数组，需要包裹在方括号中 []
5. 对象，需要包裹在大括号中 {}
6. Null

还需要注意的是 JSON 文件中无法使用注释，试图添加注释将会引发报错。

2.wxml

打开开发工具的编辑器，在根目录下找到 app.json 文件，双击打开，在 "pages/index/index" 上新增一行 "pages/wxml/index" 保存文件，就会自动建立好这个页面的所有相关文件。

与普通web开发相比，更像是使用了vue框架，进行了数据的双向绑定。

3.wxss

与常用的css几乎相同，引入了rpx（responsive pixel）尺寸单位。引用新尺寸单位的目的是，适配不同宽度的屏幕，开发起来更简单。

在小程序中，我们依然可以实现样式的引用，样式引用是这样写：

@import './test_0.wxss'

为了减轻开发者样式开发的工作量，我们提供了WeUI.wxss基础样式库。具体使用文档可参考：https://github.com/Tencent/weui-wxss

4.javascript

• 浏览器中的JavaScript 是由 ECMAScript 和 BOM（浏览器对象模型）以及 DOM（文档对象模型）组成的。
• NodeJS中的JavaScript 是由 ECMAScript 和 NPM以及Native模块组成，NodeJS的开发者会非常熟悉 NPM 的包管理系统，通过各种拓展包来快速的实现一些功能，同时通过使用一些原生的模块例如 FS、HTTP、OS等等来拥有一些语言本身所不具有的能力。
• 小程序中的 JavaScript 是由ECMAScript 以及小程序框架和小程序 API 来实现的。同浏览器中的JavaScript 相比没有 BOM 以及 DOM 对象，所以类似 JQuery、Zepto这种浏览器类库是无法在小程序中运行起来的，同样的缺少 Native 模块和NPM包管理的机制，小程序中无法加载原生库，也无法直接使用大部分的 NPM 包。