uni-app的Uts语法

2,108 阅读10分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第31天,点击查看活动详情

UTS介绍

uts 是什么

uts,全称 uni type script,是一门跨平台的、高性能的、强类型的现代编程语言。

它可以被编译为不同平台的编程语言,如:

  • web平台,编译为JavaScript
  • Android平台,编译为Kotlin
  • iOS平台,编译Swift

uts 采用了与 ts 基本一致的语法规范,支持绝大部分 ES6 API。

但为了跨端,uts进行了一些约束和特定平台的增补。

过去在js引擎下运行支持的语法,大部分在uts的处理下也可以平滑的在kotlin和swift中使用。但有一些无法抹平,需要使用条件编译。和uni-app的条件编译类似,uts也支持条件编译。写在条件编译里的,可以调用平台特有的扩展语法。

本文是 uts 的基本语法介绍。如想了解 uni-app 下如何开发 uts插件,另见文档uniapp.dcloud.net.cn/plugin/uts-…

基本语法

声明

js是无类型的,TypeScript 的 type 就是类型的意思,给js加上了类型。它的类型定义方式是在变量名后面通过加冒号和类型来进行定义。

uts 中声明变量可以用 let 或 const,详见下。

变量定义(let)

image.png 类型除了 string 之外,更多类型

常量定义(const)

image.png 注意事项:

  • 当前 uts 并未限制使用 var 来声明变量,但当使用 var 来声明变量时需要注意不同平台差异

    • 编译至 JavaScript 平台时,等同于 JavaScript 平台的 var (存在变量提升现象)
    • 编译至 Kotlin 平台时,等同于 Kotlin 平台的 var(允许重新赋值)
  • 类型定义的冒号,左右可以有一个空格,也可以没有空格。let str:string 和 let str : string 和 let str :string 和 let str: string 都是合法的。

变量命名规则

在 uts 中,使用变量名需要遵守一定的规则。

  • 变量名称可以包含数字和字母。
  • 除了下划线 _ 外,不能包含其他特殊字符,包括空格。
  • 变量名不能以数字开头。

注意:与 TypeScript 不同的是,uts 不允许以 $ 开头命名变量

类型自动推导

uts具备类型自动推导。在定义变量时如果直接赋值,而不使用冒号定义类型,也可以合法运行。

如下2种写法都是合法的,两个变量都是string类型:

image.png

any类型

如果定义变量时没有声明类型,也没有赋值。那么这个变量会被视为any类型。虽然可以使用,但uts中非常不建议这样使用。

image.png

操作符

赋值运算符(Assignment operators)

image.png

比较运算符(Comparison operators)

image.png

算数运算符(Arithmetic operators)

image.png

位运算符(Bitwise operators)

image.png

逻辑运算符(Logical operators)

image.png

字符串运算符(String operators)

除了比较操作符,它可以在字符串值中使用,连接操作符(+)连接两个字符串值相连接,返回另一个字符串,它是两个操作数串的结合。

image.png

条件(三元)运算符(Conditional operator)

条件运算符是 uts 中唯一需要三个操作数的运算符。运算的结果根据给定条件在两个值中取其一。语法为:

条件 ? 值1 : 值2

image.png

代码语句的分割

uts的多个代码语句,可以以回车或分号分割。行尾的分号可以省略。如果写在一行,应以分号分割。

如下的代码都是合法的:

image.png

数据类型

#布尔值(Boolean)

有 2 个值分别是:true 和 false

#数字(Number)

所有数字,包括整数或浮点数,包括正数负数。例如: 正整数 42 或者 浮点数 3.14159 或者 负数 -1

image.png

Kotlin 特有的数字类型

  • Byte, UByte
  • Short, UShort
  • Int, UInt
  • Long, ULong
  • Float
  • Double

#Swift 特有的数字类型

  • Int, UInt, Int8, UInt8, Int16, UInt16, Int32, UInt32, Int64, UInt64
  • Float, Float16, Float32, Float64
  • Double

注意

在 kotlin 和 swift 中,有些系统API或三方SDK的传入和返回强制约定了这些平台数字类型,此时无法使用 number。 这种情况下可以使用下面的方法,虽然可能会被编辑器报语法错误(后续HBuilderX会修复这类误报),但编译到 kotlin 和 swift 时是可用的。

  • 声明特定的平台数字类型

目前这些平台数字类型,声明类型时,与 number 不同的是,均为首字母大写

image.png

  • 在 kotlin(app-android) 下转换特定的平台数字类型

image.png

  • 在 swift(app-ios) 下转换特定的平台数字类型

image.png

字符串(String)

字符串是一串表示文本值的字符序列,例如:"hello world"

#日期(Date)

日期对象表示日期,包括年月日时分秒等各种日期。详见下

#null

一个表明 null 值的特殊关键字。

有时需定义可为null的字符串,可以在类型描述中使用|操作符

image.png 注意:uts 编译为kotlin和swift时不支持 undefined。

Object类型

对象(object)是指内存中的可以被标识符引用的一块区域,是一种引用类型。包括Array,Date,Map,Set,JSON等,uts 有一个内置对象的标准库

any类型

未定义类型,即任意类型。一般不推荐使用。

#字面量

字面量是由语法表达式定义的常量;或,通过由一定字词组成的语词表达式定义的常量。

在 uts 中,你可以使用各种字面量。这些字面量是按字面意思给出的固定的值,而不是变量

#数组字面量

数组字面值是一个封闭在方括号对 ([]) 中的包含有零个或多个表达式的列表,其中每个表达式代表数组的一个元素。当你使用数组字面值创建一个数组时,该数组将会以指定的值作为其元素进行初始化,而其长度被设定为元素的个数。

下面的示例用 3 个元素生成数组coffees,它的长度是 3。

image.png 数组字面值同时也是数组对象。

#布尔字面量

布尔类型有两种字面量:true和false。

#数字字面量

数字字面量包括多种基数的整数字面量和以 10 为基数的浮点数字面量

#整数字面量

整数可以用十进制(基数为 10)、十六进制(基数为 16)、二进制(基数为 2)表示。

  • 十进制整数字面量由一串数字序列组成,且没有前缀 0。如:0, 117, -345
  • 十六进制整数以 0x(或 0X)开头,可以包含数字(0-9)和字母 af 或 AF。如:0x1123, 0x00111 , -0xF1A7
  • 二进制整数以 0b(或 0B)开头,只能包含数字 0 和 1。如:0b11, 0b0011 , -0b11

#浮点数字面量

浮点数字面值可以有以下的组成部分:

  • 一个十进制整数,可以带正负号(即前缀“+”或“ - ”),
  • 小数点(“.”),
  • 小数部分(由一串十进制数表示),
  • 指数部分。

指数部分以“e”或“E”开头,后面跟着一个整数,可以有正负号(即前缀“+”或“-”)。浮点数字面量至少有一位数字,而且必须带小数点或者“e”(大写“E”也可)。

简言之,其语法是:

image.png

image.png

RegExp字面量

正则表达式是字符被斜线围成的表达式。下面是一个正则表达式文字的一个例子

image.png

字符串字面量

字符串字面量是由双引号(")对或单引号(')括起来的零个或多个字符。字符串被限定在同种引号之间;也即,必须是成对单引号或成对双引号。下面的例子都是字符串字面值:

image.png 你可以在字符串字面值上使用字符串对象的所有方法,你也能用对字符串字面值使用类似 String.length 的属性:

image.png

模板字符串

模板字面量 是允许嵌入表达式的字符串字面量。你可以使用多行字符串和字符串插值功能。也被称为“模板字符串”

image.png

转义特殊字符

image.png

控制流程

条件

If 语句

当一个逻辑条件为真,用 if 语句执行一个语句。当这个条件为假,使用可选择的 else 从句来执行这个语句。if 语句如下所示:

image.png

注意:if 和 else if 中的条件表达式必须为布尔值

switch 语句

switch 语句允许一个程序求一个表达式的值并且尝试去匹配表达式的值到一个 case 标签。如果匹配成功,这个程序执行相关的语句。switch 语句如下所示:

image.png 程序首先查找一个与 expression 匹配的 case 语句,然后将控制权转移到该子句,执行相关的语句。如果没有匹配值, 程序会去找 default 语句,如果找到了,控制权转移到该子句,执行相关的语句。如果没有找到 default,程序会继续执行 switch 语句后面的语句。default 语句通常出现在 switch 语句里的最后面,当然这不是必须的。

可选的 break 语句与每个 case 语句相关联, 保证在匹配的语句被执行后程序可以跳出 switch 并且继续执行 switch 后面的语句。如果 break 被忽略,则程序将继续执行 switch 语句中的下一条语句。

三元表达式

uts 支持使用三元表达式。一个条件后面会跟一个问号(?),如果条件为 true ,则问号后面的表达式 A 将会执行;表达式 A 后面跟着一个冒号(:),如果条件为 false ,则冒号后面的表达式 B 将会执行。本运算符经常作为 if 语句的简捷形式来使用。

image.png 三元操作符是右结合的,也就是说你可以像这样把它链接起来, 和 if … else if … else if … else 链类似:

image.png

循环

for

一个 for 循环会一直重复执行,直到指定的循环条件为 false。 一个 for 语句是这个样子的:

image.png 当一个 for 循环执行的时候,会发生以下过程:

  1. 如果有初始化表达式 initialExpression,它将被执行。这个表达式通常会初始化一个或多个循环计数器。
  2. 计算 condition 表达式的值。如果 condition 的值是 true,循环中的语句会被执行。如果 condition 的值是 false,for 循环终止。如果 condition 表达式整个都被省略掉了,3. condition 的值会被认为是 true。
  3. 循环中的 statement 被执行。如果需要执行多条语句,可以使用块({ ... })来包裹这些语句。
  4. 如果有更新表达式 incrementExpression,执行更新表达式。
  5. 回到步骤 2。

举例:

image.png

do...while

do...while 语句一直重复直到指定的条件求值得到假值(false)。 一个 do...while 语句看起来像这样

image.png statement 在检查条件之前会执行一次。要执行多条语句(语句块),要使用块语句({ ... })包括起来。 如果 condition 为真(true),statement 将再次执行。 在每个执行的结尾会进行条件的检查。当 condition 为假(false),执行会停止并且把控制权交回给 do...while 后面的语句。

举例:

image.png

while

一个 while 语句只要指定的条件求值为真(true)就会一直执行它的语句块。一个 while 语句看起来像这样:

image.png 如果这个条件变为假,循环里的 statement 将会停止执行并把控制权交回给 while 语句后面的代码。

条件检测会在每次 statement 执行之前发生。如果条件返回为真, statement 会被执行并紧接着再次测试条件。如果条件返回为假,执行将停止并把控制权交回给 while 后面的语句。

要执行多条语句(语句块),要使用语句块 ({ ... }) 包括起来。

举例:

image.png

break

使用 break 语句来终止循环,switch。

举例:

image.png

continue

使用 continue 语句来终止当前循环,并在下一次迭代时继续执行循环。

举例:

image.png

image.png 使用 try……catch 表达式来捕获异常:

image.png