2.4.2 WXS

WXS（WeiXin Script）是小程序的一套脚本语言，结合 WXML，可以构建出页面的结构。

注意

1. wxs 不依赖于运行时的基础库版本，可以在所有版本的小程序中运行。

2. wxs 与 javascript 是不同的语言，有自己的语法，并不和 javascript 一致。

3. wxs 的运行环境和其他 javascript 代码是隔离的，wxs 中不能调用其他 javascript 文件中定义的函数，也不能调用小程序提供的API。

4. wxs 函数不能作为组件的事件回调。

5. 由于运行环境的差异，在 iOS 设备上小程序内的 wxs 会比 javascript 代码快 2 ~ 20 倍。在 android 设备上二者运行效率无差异。

2.4.2.1 WXS 模块

WXS 代码可以编写在 wxml 文件中的 <wxs> 标签内，或以 .wxs 为后缀名的文件内。

2.4.2.1.1 模块

每一个 .wxs 文件和 <wxs> 标签都是一个单独的模块。

每个模块都有自己独立的作用域。即在一个模块里面定义的变量与函数，默认为私有的，对其他模块不可见。

一个模块要想对外暴露其内部的私有变量与函数，只能通过 module.exports 实现。

2.4.2.1.2 .wxs 文件

在微信开发者工具里面，右键可以直接创建 .wxs 文件，在其中直接编写 WXS 脚本。

示例代码：

// /pages/comm.wxs

var foo = "'hello world' from comm.wxs";
var bar = function(d) {
  return d;
}
module.exports = {
  foo: foo,
  bar: bar
};

上述例子在 /pages/comm.wxs 的文件里面编写了 WXS 代码。该 .wxs 文件可以被其他的 .wxs 文件 或 WXML 中的 <wxs> 标签引用。

2.4.2.1.3 module 对象

每个 wxs 模块均有一个内置的 module 对象。

1、属性

exports: 通过该属性，可以对外共享本模块的私有变量与函数。

2.4.2.1.4 require 函数

在 .wxs 模块中引用其他 wxs 文件模块，可以使用 require 函数。

引用的时候，要注意如下几点：

1、只能引用 .wxs 文件模块，且必须使用相对路径。

2、wxs 模块均为单例，wxs 模块在第一次被引用时，会自动初始化为单例对象。多个页面，多个地方，多次引用，使用的都是同一个 wxs 模块对象。

3、如果一个 wxs 模块在定义之后，一直没有被引用，则该模块不会被解析与运行。

src 对应wxml 对wxs 模块的引用；require 满足其他wxs 文件对wxs 文件模块的引用。

2.4.2.1.5 <wxs> 标签

<wxs> 标签属性

1、module 属性

module 属性是当前 <wxs> 标签的模块名。在单个 wxml 文件内，建议其值唯一。有重复模块名则按照先后顺序覆盖（后者覆盖前者）。不同文件之间的 wxs 模块名不会相互覆盖。

module 属性值的命名必须符合下面两个规则：

• 首字符必须是：字母（a-zA-Z），下划线（_）
• 剩余字符可以是：字母（a-zA-Z），下划线（_）， 数字（0-9）

2、src 属性

src 属性可以用来引用其他的 wxs 文件模块。

引用的时候，要注意如下几点：

• 只能引用 .wxs 文件模块，且必须使用相对路径。

• wxs 模块均为单例，wxs 模块在第一次被引用时，会自动初始化为单例对象。多个页面，多个地方，多次引用，使用的都是同一个 wxs 模块对象。

• 如果一个 wxs 模块在定义之后，一直没有被引用，则该模块不会被解析与运行。

3、注意

• <wxs> 模块只能在定义模块的 WXML 文件中被访问到。使用 <include> 或 <import> 时，<wxs> 模块不会被引入到对应的 WXML 文件中。如需引用，则需要将 <wxs> 模块的代码放在单独的 .wxs 文件模块，然后使用使用 src 引用。

• <template> 标签中，只能使用定义该 <template> 的 WXML 文件中定义的 <wxs> 模块。

2.4.2.2 变量

2.4.2.2.1 概念

1、WXS 中的变量均为值的引用。

2、没有声明的变量直接赋值使用，会被定义为全局变量。

3、如果只声明变量而不赋值，则默认值为 undefined。

4、var表现与javascript一致，会有变量提升。

2.4.2.2.2 变量名

变量命名必须符合下面两个规则：

• 首字符必须是：字母（a-zA-Z），下划线（_）
• 剩余字符可以是：字母（a-zA-Z），下划线（_）， 数字（0-9）

2.4.2.3 注释

WXS 主要有 3 种注释的方法。

示例代码：

<!-- wxml -->
<wxs module="sample">
// 方法一：单行注释

/*
方法二：多行注释
*/

/*
方法三：结尾注释。即从 /* 开始往后的所有 WXS 代码均被注释

var a = 1;
var b = 2;
var c = "fake";

</wxs>

上述例子中，所有 WXS 代码均被注释掉了。

方法三 和 方法二 的唯一区别是，没有 */ 结束符。

2.4.2.4 运算符

1. 基本运算符
2. 一元运算符
3. 位运算符
4. 比较运算符
5. 等值运算符
6. 赋值运算符
7. 二元逻辑运算符
8. 其他运算符

参考：运算符介绍及优先级

2.4.2.5 语句

1. if 语句
2. switch 语句
3. for 语句
4. while 语句

参考：语句

2.4.2.6 数据类型

WXS 语言目前共有以下几种数据类型：

1. number ： 数值
2. string ：字符串
3. boolean：布尔值
4. object：对象
5. function：函数
6. array : 数组
7. date：日期
8. regexp：正则

参考：数据类型

2.4.2.7 基础类库

参考：基础类库

参考资料：https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/