WXS(WeiXin Script)是小程序的一套腳本語言,結合 WXML,可以構建出頁面的結構。
在wxml頁面中,只能在插值{{ }}中寫簡單的js表達式,而不能調用方法。wxs就是為了能在頁面中使用js而存在的。
WXS 中不支持let和const,不支持箭頭函數。
注釋:
WXS 主要有 3 種注釋的方法:
// 方法一:單行注釋 <!-- wxml --> /* 方法二:多行注釋 */ /*
方法三:結尾注釋。即從 /* 開始往后的所有 WXS 代碼均被注釋
變量:
WXS 中的變量均為值的引用。沒有聲明的變量直接賦值使用,會被定義為全局變量。如果只聲明變量而不賦值,則默認值為 undefined。var表現與javascript一致,會有變量提升。
變量命名必須符合下面兩個規則:
- 首字符必須是:字母(a-zA-Z),下划線(_)
- 剩余字符可以是:字母(a-zA-Z),下划線(_), 數字(0-9)
數據類型:
WXS 語言目前共有以下幾種數據類型:string、number、boolean、object、array、function、date、regexp。
生成 date 對象需要使用 getDate函數, 返回一個當前時間的對象。
var date = getDate(1500000000000);
生成 regexp 對象需要使用 getRegExp函數。
var reg = getRegExp('(\d)(?=(?:\d{3}[+]?)+$)','g');
模塊:
WXS 代碼可以編寫在 wxml 文件中的 <wxs> 標簽內,或以.wxs 為后綴名的文件內。
導出:
每一個 .wxs 文件和 <wxs> 標簽都是一個單獨的模塊。每個模塊都有自己獨立的作用域,即在一個模塊里面定義的變量與函數,默認為私有的,對其他模塊不可見。一個模塊要想對外暴露其內部的私有變量與函數,只能通過 module.exports 實現。
每個 wxs 模塊均有一個內置的 module 對象。module 對象有一個exports屬性,通過該屬性,可以對外共享本模塊的私有變量與函數。
// utils.wxs var formatNumber = function(val){ var reg = getRegExp('(\d)(?=(?:\d{3}[+]?)+$)','g'); return (val>1000) ? val.toString().replace(reg, '$1,') : val; } module.exports = { formatNumber: formatNumber }
導入:
只能引用 .wxs 文件模塊,且必須使用相對路徑。
wxs 模塊均為單例,wxs 模塊在第一次被引用時,會自動初始化為單例對象。多個頁面,多個地方,多次引用,使用的都是同一個 wxs 模塊對象。
如果一個 wxs 模塊在定義之后,一直沒有被引用,則該模塊不會被解析與運行。
1.在.wxml中引用:
<wxs> 標簽的屬性:
module:當前 <wxs> 標簽的模塊名。必填字段。module 屬性值的命名必須符合以下規則:首字符必須是字母(a-zA-Z),下划線(_);剩余字符可以是:字母(a-zA-Z),下划線(_), 數字(0-9)。有重復模塊名則按照先后順序覆蓋(后者覆蓋前者)。
src:引用 .wxs 文件的相對路徑。
//home.wxml <wxs src="../../utils/utils.wxs" module="utils"></wxs> <text>{{utils.formatNumber(fanNum)}}</text>
2.在.wxs模塊中引用其他 wxs 文件模塊,可以使用 require 函數。
// utils.wxs var tools = require("./tools.wxs"); console.log(tools.msg);