《一》微信小程序简介
微信开放文档：
https://developers.weixin.qq.com/miniprogram/dev/framework/。
小程序与普通网页开发的区别：
小程序的主要开发语言是 JavaSciript，小程序的开发同普通的网页相比有很大的相似性，对于前端开发者而言，从网页开发迁移到小程序的开发成本并不高，但是二者还是有一些区别的：
-
网页开发渲染线程和脚本线程是互斥的；而在小程序中，小程序的逻辑层和渲染层是分开的，小程序的渲染层和逻辑层分别由2个线程管理，其中 WXML 模板和 WXSS 样式工作在渲染层，渲染层的界面使用了WebView 进行渲染，JS 脚本工作在逻辑层，逻辑层采用JsCore线程运行JS脚本。
一个小程序存在多个界面，所以渲染层存在多个WebView线程。
这两个线程的通信会经由微信客户端，做中转，逻辑层发送网络请求也经由Native转发。
-
网页开发者可以使用到各种浏览器暴露出来的 DOM API，进行 DOM 选中和操作；而小程序的逻辑层运行在 JSCore 中，并没有一个完整浏览器对象，因而缺少相关的 DOM API 和 BOM API。这一区别导致前端开发非常熟悉的一些库，例如 jQuery 等，在小程序中是无法运行的，同时 JSCore 的环境同 NodeJS 环境也是不尽相同，所以一些 NPM 的包在小程序中也是无法运行的。
-
网页开发者需要面对的环境是各式各样的浏览器，PC 端需要面对 IE、Chrome、QQ浏览器等，在移动端需要面对Safari、Chrome以及 iOS、Android 系统中的各式 WebView ；而小程序开发过程中需要面对的是两大操作系统 iOS 和 Android 的微信客户端，以及用于辅助开发的小程序开发者工具。
小程序中三大运行环境也是有所区别的。
-
网页开发者在开发网页的时候，只需要用到浏览器，并且搭配上一些辅助工具或者编辑器即可；小程序的开发则有所不同，需要经过申请小程序账号、安装小程序开发工具、配置项目等过程方可完成。
使用步骤：
申请账号：
开发小程序的第一步，需要拥有一个小程序账号，通过这个账号就可以管理小程序。
-
访问微信公众平台
https://mp.weixin.qq.com/点击立即注册进入小程序注册页，根据指引填写信息和提交相应的资料，就可以拥有自己的小程序帐号。
-
在微信公众平台，就可以管理小程序的权限，查看数据报表，发布小程序等操作。
小程序的 AppID 相当于小程序平台的一个身份证，会在很多地方用到。
微信小程序必须填写服务器域名，否则将无法访问。服务器域名不支持 http。调试情况下不检测域名合法性。
安装开发工具：
前往https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html开发者工具下载页面，根据自己的操作系统下载对于的安装包进行安装。
新建项目：
- 新建一个空白文件夹。
- 打开微信开发者工具 --> 选择新建的目录（会自动获取项目名称）–> 填入 appId --> 选择不使用云服务 --> 点击新建。
- 即可新建一个带有默认模板的项目。
- 编译、预览：点击微信开发者工具上的编译按钮，可以在工具的左侧模拟器界面看到这个小程序的表现；也可以点击预览按钮，通过微信的扫一扫在真机上体验小程序。
- 发布项目：点击微信开发者工具的上传即可。
目录结构：
- 微信客户端在打开小程序之前，会把整个小程序的代码包下载到本地。
- 紧接着通过
app.json的 pages 字段就可以知道当前小程序的所有页面路径，而写在 pages 字段的第一个页面就是这个小程序的首页，于是微信客户端就把首页的代码装载进来，通过小程序底层的一些机制，就可以渲染出这个首页。微信客户端会先根据页面的 JSON 配置生成一个界面，紧接着客户端就会装载这个页面的 WXML 结构和 WXSS 样式，最后客户端会装载 JS。
- 小程序启动之后，在
app.js定义的 App 实例的 onLaunch 回调会被执行。
小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。
- 一个小程序主体部分由三个文件组成，必须放在项目的根目录：
app.js小程序全局逻辑、app.json小程序公共配置、app.wxss小程序公共样式表。 - 一个小程序页面由四个具有相同的路径与文件名的文件组成，分别是：
.wxml页面结构、.json页面配置、.js页面逻辑、.wxss页面样式表。
WXML 模板：
WXML 充当的是类似 HTML 的角色。
WXSS 样式：
WXSS 具有 CSS 大部分的特性，小程序在 WXSS 也做了一些扩充和修改。
JS 逻辑交互：
通过 JS 来实现业务逻辑。
在 JavaScript 文件中声明的变量和函数只在该文件中有效；不同的文件中可以声明相同名字的变量和函数，不会互相影响。
JSON 配置：
通过 JSON 来进行静态配置。
- 小程序配置
app.json：app.json是当前小程序的全局配置，包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。 - 页面配置
page.json：可以让开发者独立定义每个页面的一些属性。 - 工具配置
project.config.json：小程序开发者工具在每个项目的根目录都会生成一个project.config.json，在工具上做的任何配置都会写入到这个文件，当重新安装工具或者换电脑工作时，只要载入同一个项目的代码包，开发者工具就自动会恢复到当时开发项目时的个性化配置。
基础库：
基础库存在于微信客户端中，是小程序运行的必要环境，封装了微信和手机的能力提供给小程序使用。
基础库和微信客户端一样，有其自己的版本，每个版本都会有一些新特性。微信官方为了使得基础库的版本和微信客户端的版本同步，采取了一个微信客户端版本对应一个基础库版本的方式。
基础库版本：小程序基础库的版本。
客户端版本：微信 APP 的版本。
小程序版本：小程序发布在线上的版本。
小程序是通过基础库运行在手机及微信上的。
低版本兼容：
版本号比较：
开发者可以在小程序中通过调用 wx.getSystemInfo 或者 wx.getSystemInfoSync 获取到当前小程序运行的基础库的版本号。通过版本号比较的方式进行运行低版本兼容逻辑。这种方式适用于所有情况。
微信客户端和小程序基础库的版本号风格为
Major.Minor.Patch（主版本号 . 次版本号 . 修订版本号）。
function compareVersion(v1, v2) {
v1 = v1.split('.')
v2 = v2.split('.')
const len = Math.max(v1.length, v2.length)
while (v1.length < len) {
v1.push('0')
}
while (v2.length < len) {
v2.push('0')
}
for (let i = 0; i < len; i++) {
const num1 = parseInt(v1[i])
const num2 = parseInt(v2[i])
if (num1 > num2) {
return 1
} else if (num1 < num2) {
return -1
}
}
return 0
}
const version = wx.getSystemInfoSync().SDKVersion
if (compareVersion(version, '1.1.0') >= 0) {
wx.openBluetoothAdapter()
} else {
wx.showModal({
title: '提示',
content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
})
}
API 存在判断：
对于新增的 API，可以通过判断该 API 是否存在来判断是否支持用户使用的基础库版本。
if (wx.openBluetoothAdapter) {
wx.openBluetoothAdapter()
} else {
wx.showModal({
title: '提示',
content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
})
}
wx.canIUse：
可以通过 wx.canIUse 来判断是否可以在该基础库版本下直接使用。
- API 参数或返回值：
wx.showModal({ success: function(res) { if (wx.canIUse('showModal.success.cancel')) { console.log(res.cancel) } } }) - 组件：
Page({ data: { canIUse: wx.canIUse('cover-view') } })
设置最低基础库版本：
开发者可以登录小程序管理后台，进入「设置 - 基本设置 - 基础库最低版本设置」进行配置。设置后，若用户基础库版本低于设置值，则无法正常打开小程序，并提示用户更新客户端版本。
小程序的运行机制和更新机制：
运行机制：
小程序启动会有两种情况，一种是「冷启动」，一种是「热启动」。
- 热启动：假如用户已经打开过某小程序，然后在一定时间内再次打开该小程序，此时无需重新启动，只需将后台的小程序切换到前台。
当用户点击右上角退出按钮，或者按了设备 Home 键离开微信，小程序并没有直接销毁，而是从前台进入了后台。
当再次打开小程序，并不是进入主页面，而是进入离开小程序时缓存的页面，又会从后台进入了前台。 - 冷启动：指的是用户首次打开或小程序被微信主动销毁后再次打开的情况，此时小程序需要重新加载启动。
只有当小程序进入后台一定时间，或者系统资源占用过高，小程序才会被真正的销毁。
更新机制：
小程序冷启动时如果发现有新版本，将会异步下载新版本的代码包，并同时用客户端本地的包进行启动，即新版本的小程序需要等下一次冷启动才会应用上。
如果需要马上应用最新版本，可以使用 wx.getUpdateManager() API 进行处理。
const updateManager = wx.getUpdateManager()
// 新版本下载成功后回调
updateManager.onUpdateReady(function () {
wx.showModal({
title: '更新提示',
content: '新版本已经准备好，是否重启应用？',
success: res => {
if (res.confirm) {
// 应用新版本并重启
updateManager.applyUpdate()
}
}
})
})