Esta publicación es una nota de 9 horas de aprendizaje para completar el desarrollo de los applets de WeChat .
Documentación: subprogramas WXS
WXS (WeiXin Script) es un lenguaje de secuencias de comandos para applets. Combinado con WXML, se puede construir la estructura y el contenido de la vista de página. En general, WXS se utiliza para filtrar o procesar cálculos. WXS en realidad encapsula y restringe la capa superior del lenguaje de secuencias de comandos JavaScript.
Nota: El entorno de ejecución de WXS está aislado de otros códigos javascript. Las funciones definidas en otros archivos javascript no se pueden llamar en WXS, ni se pueden llamar las API proporcionadas por los applets. Las funciones WXS no se pueden utilizar como devoluciones de llamadas de eventos de componentes.
WXS tiene las siguientes características:
módulos, variables, comentarios, operadores, declaraciones, tipos de datos y bibliotecas de clases básicas
Características de WXS
módulo módulo
Documentación: Módulo · Applet Un
módulo puede ser declarado por una etiqueta o por un archivo. Todas las variables del módulo WXS tienen alcance, y cada módulo tiene sus propias variables por defecto, son privadas e invisibles para el mundo exterior.
- Declarar a través de etiquetas:
<!--index.wxml-->
<wxs module="m1">
module.exports = {
message: 'Hello,world!'
}
</wxs>
<view>{
{
m1.message}}</view>m1Las variables del módulo se exponen para uso externo a través de la función module.exports .
- Para declarar en forma de archivo, debe nombrar el archivo de destino
.wxscomo el sufijo:
<!--index.wxml-->
<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!"
}También se puede hacer referencia a otros archivos WXS dentro de un archivo WXS require.
variablevariable
Documentación: Variables · Applets
El uso de variables en applets es consistente con el de ES5.
- Las variables en WXS son referencias a valores.
- Las variables que no se declaran se asignan y utilizan directamente, y se definirán como variables globales.
- Si declara una variable sin asignarle un valor, el valor predeterminado no está definido.
- El rendimiento de var es consistente con javascript y habrá una promoción variable.
- El primer carácter del nombre de la variable debe ser: letra (a-zA-Z), guión bajo ( ), los caracteres restantes pueden ser: letra (a-zA-Z), guión bajo ( ), número (0-9)
anotación
<!-- wxml -->
<wxs module="sample">
// 方法一：单行注释
/*
方法二：多行注释
*/
/*
方法三：结尾注释。即从 /* 开始往后的所有 WXS 代码均被注释，不会被执行
var a = 1;
var b = 2;
var c = "fake";
</wxs>operador operador
Documentación: Operadores · Los operadores del Mini Program WXS incluyen operadores básicos, operadores unarios, operadores bit a bit, operadores de comparación, operadores de igualdad, operadores de asignación y operadores lógicos binarios.
- Operadores básicos:
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);- Operadores unarios:
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);donde typeofoperador es el tipo de datos de la variable de retorno.
- Operadores bit a bit:
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));- operador de comparación
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));- operador de igualdad
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));- operador de asignación
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);- Operadores Lógicos Binarios
var a = 10, b = 20;
// 逻辑与
console.log(20 === (a && b));
// 逻辑或
console.log(10 === (a || b));- operador condicional
var a = 10, b = 20;
//条件运算符
console.log(20 === (a >= 10 ? a + 10 : b + 10));
//逗号运算符
console.log(20 === (a, b));Documentación de referencia de precedencia de operadores .
Las declaraciones de WXS son básicamente las mismas que las que se usan comúnmente en JavaScript, incluidos if...else, do...while, switchetc. La diferencia es que try...catchlas declaraciones no son compatibles con WXS.
tipo de datos tipo de datos
número : valor numérico. número incluye dos tipos de valores: entero y decimal.
cadena: cadena. Hay dos usos de cadena, comillas simples y comillas dobles.
booleano: valor booleano. Los valores booleanos tienen solo dos valores específicos: verdadero y falso.
objeto Objeto. objeto es un par clave-valor desordenado.
función: función
matriz: matriz
fecha: fecha. Para generar un objeto de fecha, debe usar getDatela función , que devuelve un objeto de la hora actual.
expresión regular: Regular. La generación de un objeto regexp requiere el uso de getRegExpla función .
Para conocer las propiedades y los métodos específicos del tipo de datos, consulte los documentos: Tipo de datos · Applet y estándar ES5.
biblioteca de clases basica biblioteca basica
Documentación: Biblioteca de clases básicas · El miniprograma
WXS tiene 6 bibliotecas de clases básicas: Matemáticas, JSON, Número, Fecha, Consola, Global. Es básicamente consistente con el estándar ES5.
La diferencia es que la biblioteca de clases de la consola WXS solo proporciona console.logeste método. La biblioteca de la clase Date solo proporciona tres métodos del constructor Date en ES5, a saber, Date.parse(analizar la fecha y la hora en forma de cadena y devolver la marca de tiempo de Unix de la fecha y la hora), ( Date.nowdevolver la marca de tiempo de Unix de la fecha actual y la hora), Date.UTC(devuelve la marca de tiempo Unix de la hora especificada).