学习微信小程序开发框架之脚本语言WXS
此贴为学习9 小时搞定微信小程序开发 的笔记。
文档：WXS · 小程序
WXS（WeiXin Script）是小程序的一套脚本语言。结合 WXML，可以构建出页面视图的结构和内容。一般使用WXS做过滤处理，或者计算处理。WXS其实就是对JavaScript脚本语言的上层做了一些封装和限制。
注意：WXS的运行环境和其他 javascript 代码是隔离的，WXS中不能调用其他 javascript 文件中定义的函数，也不能调用小程序提供的API。WXS函数不能作为组件的事件回调。
WXS有以下特性：
模块、变量、注释、运算符、语句、数据类型、基础类库
WXS特性
模块 module
文档：模块 · 小程序
模块可以通过标签来声明，也可以通过一个文件来声明。WXS模块的变量都是有作用域的，每一个模块默认自己的变量都是私有的，对外是不可见的
- 通过标签来声明：
<wxs module="m1">
module.exports = {
message: 'Hello,world!'
}
wxs>
<view>{{m1.message}}view>通过module.exports函数让m1模块的变量暴露出来供外部使用。
- 以文件方式来声明，需要将目标文件命名为以
.wxs为后缀：
<wxs src="./m2.wxs" module="m2">wxs>
<view>{{m2.message}}view>//m2.wxs
module.exports = require('./m1.wxs')//m1.wxs
module.exports = {
message: "hello world!"
}在WXS文件内也可以通过require来引用其他WXS文件。
变量 variate
文档：变量 · 小程序
小程序的变量和ES5的变量用法一致。
- WXS 中的变量均为值的引用。
- 没有声明的变量直接赋值使用，会被定义为全局变量。
- 如果只声明变量而不赋值，则默认值为 undefined。
- var表现与javascript一致，会有变量提升。
- 变量名首字符必须是：字母（a-zA-Z），下划线（），剩余字符可以是：字母（a-zA-Z），下划线（）， 数字（0-9）
注释 annotation
<wxs module="sample">
// 方法一：单行注释
/*
方法二：多行注释
*/
/*
方法三：结尾注释。即从 /* 开始往后的所有 WXS 代码均被注释，不会被执行
var a = 1;
var b = 2;
var c = "fake";
wxs>运算符 operator
文档：运算符 · 小程序WXS的运算符包括基本运算符、一元运算符、位运算符、比较运算符、等值运算符、赋值运算符和二元逻辑运算符。
- 基本运算符：
var a = 10, b = 20;
// 加法运算
console.log(30 === a + b);
// 减法运算
console.log(-10 === a - b);
// 乘法运算
console.log(200 === a * b);
// 除法运算
console.log(0.5 === a / b);
// 取余运算
console.log(10 === a % b);
var a = '.w' , b = 'xs';
// 加法运算（+）也可以用作字符串的拼接
console.log('.wxs' === a + b);- 一元运算符：
var a = 10, b = 20;
// 自增运算
console.log(10 === a++);
console.log(12 === ++a);
// 自减运算
console.log(12 === a--);
console.log(10 === --a);
// 正值运算
console.log(10 === +a);
// 负值运算
console.log(0-10 === -a);
// 否运算
console.log(-11 === ~a);
// 取反运算
console.log(false === !a);
// delete 运算
console.log(true === delete a.fake);
// void 运算
console.log(undefined === void a);
// typeof 运算
console.log("number" === typeof a);其中typeof运算符是返回变量的数据类型。
- 位运算符：
var a = 10, b = 20;
// 左移运算
console.log(80 === (a << 3));
// 无符号右移运算
console.log(2 === (a >> 2));
// 带符号右移运算
console.log(2 === (a >>> 2));
// 与运算
console.log(2 === (a & 3));
// 异或运算
console.log(9 === (a ^ 3));
// 或运算
console.log(11 === (a | 3));- 比较运算符
var a = 10, b = 20;
// 小于
console.log(true === (a < b));
// 大于
console.log(false === (a > b));
// 小于等于
console.log(true === (a <= b));
// 大于等于
console.log(false === (a >= b));- 等值运算符
var a = 10, b = 20;
// 等号
console.log(false === (a == b));
// 非等号
console.log(true === (a != b));
// 全等号
console.log(false === (a === b));
// 非全等号
console.log(true === (a !== b));- 赋值运算符
var a = 10;
a = 10; a *= 10;
console.log(100 === a);
a = 10; a /= 5;
console.log(2 === a);
a = 10; a %= 7;
console.log(3 === a);
a = 10; a += 5;
console.log(15 === a);
a = 10; a -= 11;
console.log(-1 === a);
a = 10; a <<= 10;
console.log(10240 === a);
a = 10; a >>= 2;
console.log(2 === a);
a = 10; a >>>= 2;
console.log(2 === a);
a = 10; a &= 3;
console.log(2 === a);
a = 10; a ^= 3;
console.log(9 === a);
a = 10; a |= 3;
console.log(11 === a);- 二元逻辑运算符
var a = 10, b = 20;
// 逻辑与
console.log(20 === (a && b));
// 逻辑或
console.log(10 === (a || b));- 条件运算符
var a = 10, b = 20;
//条件运算符
console.log(20 === (a >= 10 ? a + 10 : b + 10));
//逗号运算符
console.log(20 === (a, b));运算符的优先级参考文档。
WXS的语句和JavaScript里常用的语句基本是一致的，包括if...else，do...while，switch等等，区别在于WXS内不支持try...catch语句。
数据类型 data type
number ： 数值。number 包括两种数值：整数，小数。
string ：字符串。string有两种用法，单引号和双引号。
boolean：布尔值。布尔值只有两个特定的值：true 和 false。
object：对象。object 是一种无序的键值对。
function：函数
array : 数组
date：日期。生成 date 对象需要使用 getDate函数, 返回一个当前时间的对象。
regexp：正则。生成 regexp 对象需要使用 getRegExp函数。
数据类型的具体的属性和方法，参考文档：数据类型 · 小程序和ES5标准。
基础类库 basic library
文档：基础类库 · 小程序
WXS共有6种基础类库：Math, JSON, Number, Date, console, Global。和ES5标准基本一致。
区别在于，WXS的console类库是只提供console.log这一个方法。Date类库只提供了ES5中Date构造函数的三个方法即Date.parse（解析字符串形式的日期时间，返回该日期时间的Unix时间戳），Date.now（返回当前日期时间的Unix时间戳），Date.UTC（返回指定时间的Unix时间戳）。