HarmonyOS 开发：ArkTS 语言基础

基本概述：

在鸿蒙开发早期使用JavaScript 配合Fage 模型，而如今更为推荐ArkTS 语言 + Stage 模型，这跟Android 开发很相近。早期Android 使用Java 语言配合第三方框架，现Kotlin + JetPack 框架逐渐占据主流地位。ArkTS 语言基础是我们走进HarmonyOS 开发的第一课显。
文章以ArkTS 语言为主题，通过文字 + Demo 的形式，简略介绍了鸿蒙开发前期所需的ArkTS 语言基础。
ArkTS 是在TypeScript 的基础上加上鸿蒙特性，而TypeScript 又是在JavaScript 的基础上演变而来的。因此，TypeScript 和JavaScript 也是需要了解的

ArkTS 语言初探

语言发展历史

.ets 是继承自 TypeScript 而来的
ArkTS 特性：树结构、声明式UI、组件化、状态管理
- ArkTS = 鸿蒙特性 + TypeScript
- 鸿蒙代码与Flutter、Compose、Swift、React 拥有极大相似性，均为声明式UI + 特定语言

基本语法

示意图：
基本概念：
- 装饰器：用于装饰类、结构、方法以及变量，并赋予其特殊的含义。如上述示例中@Entry、@Component和@State都是装饰器，@Component表示自定义组件，@Entry表示该自定义组件为入口组件，@State表示组件中的状态变量，状态变量变化会触发UI刷新。
- UI描述：以声明式的方式来描述UI的结构，例如build() 中的代码块。
- 自定义组件：可复用的UI单元，可组合其他组件，如上述被@Component装饰的 struct Hello。
- 系统组件：ArkUI框架中默认内置的基础和容器组件，可直接被开发者调用，比如示例中的Column、Text、Divider、Button。
- 属性方法：组件可以通过链式调用配置多项属性，如fontSize()、width()、height()、backgroundColor()等。
- 事件方法：组件可以通过链式调用设置多个事件的响应逻辑，如跟随在Button后面的onClick()。
- 系统组件、属性方法、事件方法具体使用可参考基于ArkTS的声明式开发范式。

数字类型

若定义在结构体外，其前需加 let 关键字

typescript 复制代码

let number1 : number = 99 //默认情况下是十进制的
let number2 : number = 0b10111 //二进制
let number3 : number = 0o123456780 //八进制
let number3 : number = 0x1234567890ABCDEF //十六进制

在结构体内部就不要 let
ini 复制代码
```
number1 : number = 99 
```

字符串类型

字符串声明：单双引号相同

ini 复制代码

let string1 : String = "WAsbry"
let string2 : String = 'WAsbry'

字符串拼接：

typescript 复制代码

let string : string = `你的名字是：${string1}` //方法一：推荐

let string2 : String = 'WAsbry'
let string : string = 'string2 = ' + string2//也可使用 + 进行拼接

联合类型

多种类型组装在一起，变量最后的类型取决于最后一次赋值操作

typescript 复制代码

let objectType : string | number | boolean 
objectType = true //此时objectType 为boolean 类型
objectType = "WAsbry" //此时objectType 为string 类型
objectType = 999 //此时objectType 为number 类型

数组类型

两种声明方式：数组下标从0开始

typescript 复制代码

let strings1 : Array<string> = ['AAA','BBB','CCC'] //常用
let strings2 : string[] = ['AAA','BBB','CCC']

枚举类型

代码展示

csharp 复制代码

enum Color {Red,Green,Blue}
let color : Color = Color.red

元祖类型

类似 Java 中的 Map 键值对

ini 复制代码

let name1 : [string,number]; //声明
name1 = ["WAsbry",23];//赋值

未知类型

unknown：相当于Java 的 Object，或者是 Kotlin 中的 Any 类型

ini 复制代码

let testType : unknown = 6; //声明
testType = "WAsbry" //二次赋值，现为字符串类型
testType = false //再次赋值，现为boolean 类型

补充类型

必须在声明时就好定好，用的时候，也只能传这个

csharp 复制代码

//null 类型，用途较少
let str1 : null = null;//声明
str1 = null;//使用

//null 类型，用途较少
let str2 : Undefined = undefind

函数类型

函数声明：此处有点问题

javascript 复制代码

/*
函数名：setName 
函数参数：name 
返回值类型：void
*/
function setName(name) : void{
    
}

this 关键字

作用：访问结构体内定义的变量
举例：结构体内外定义了同名同类型但不同值的变量
- 加 this ：获取结构体内
- 不加：获取结构体外

代码：

scss 复制代码

let postion : string = "outside"

@Entry
@Component
struct Index {

  postion : string = "inside"//若访问该变量，需使用this 

  build() {
    Row() {
      Column() {
        Text(this.postion)//指代inside 字符串
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
        Text(postion)//指代outside 字符串
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
      }
      .width('100%')
    }
    .height('100%')
  }
}

效果：

综合使用

考察点：
- 字符串、枚举类型、联合变量的定义及使用
- this 关键字指向问题
效果展示：

代码示例：

typescript 复制代码

let postion : string = "outside"

enum Color{Rad = 'red',green = 'green'};//定义枚举类型变量
let color = Color.green

let flag : number | string | boolean //此为联合类型变量
flag = 123
flag = "false"
flag = false//联合类型遍历的最后一次赋值，决定其实际变量类型

@Entry
@Component
struct Index {

  postion : string = "inside"//定义在结构体内的变量：访问时需借助this 

  build() {
    Row() {
      Column() {
        Text("准备判断")
        Divider()
        if (flag){
          Text("inside").fontColor(color)
        }else {
          Text(postion).fontColor(Color.Rad)
        }
      }.width('100%')
    }.height('100%')
  }
}