ArkTs基础

ArkTs的介绍

        ArkTs语言是基于Ts的扩展，是harmony的主力应用开发语言，匹配了ArkUI框架，扩展了声明式UI、状态管理等，可以实现开发跨端应用。而Ts是Js的超集，扩展了Js的语法。

TS基础

TypeScript的基础类型

类型	表示	示例
布尔值	boolean	let isFinished :boolean = false;
数字类型	number	let number :number = 20;
字符串	string	let name : string = 'strawberry'; let name :string = "strawberry";
数组	number[] 或 Array<number>	let list1 : number[] = [1,2,3]; let list2 : Array<number> = [1,2,3];
元组	表示一个已知元素数量和类型的数组，各元素的类型不必相同	let x = [string ,number];
枚举	enum	enum Color{Red,Green,Blue}
unknown	未知编程阶段还不清楚类型的变量
void	返回值为void	同C
null、undefined	需要分开定义	let u : undefined = undefined; let null :null = null;
联合类型	取值可以为多种类型中的一种	let myFavoriteNumber :string | number   myFavoriteNumber = ''；   myFavoriteNumber = 20；

条件语句

    同其他开发语言。

函数

定义

      与kotlin类似，关键字由fun改为function，示例代码如下：

Ts:
function add(x:number ,y :number):number{
    return x+y;
} 

kotlin：

fun add (x:Int , y:Int) :Int{
    return x+y;//kotlin可以不写分号，目前没发现ts可以不需要写分号，后续发现补充
}

可选参数

用？表示，类似kotlin的空判断

剩余参数

可以被当做个数不限的可选参数，类似变长参数，用...表示

箭头函数

ES6版本提供了一个箭头函数，定义匿名函数的简写语法，用于函数表达式，省略了function的关键字。

([param1,param2,...paramn]) =>{
    //语句块
}

类

用class表示，基于类的面向对象的编程方式。调用类似于java

同样具有继承（extends)

模块（module)

将代码拆分成多个文件，即所谓的模块。模块可以相互加载，并可以使用export和import交换功能，模块间可以相互调用。

模块里的变量、函数和类在模块外部是不可见的，除非明确使用export导出，同理，必须通过import导入其他模块导出的变量、函数、类等。

迭代器

当对象实现了Symbol.iterator属性，表示它可迭代，具有迭代性。

迭代方式：

• for .. of (循环遍历）遍历的是数组的值
• for .. in  遍历的是数组的下标（index) 、、0,1,2,3..

网址：华为开发者学堂

ArkTS

声明式UI

装饰器：装饰类、结构、方法和变量，赋予其特殊含义。

@Component:装饰器，表示自定义组件  （疑问：和注解有什么区别？特殊注解？）

@State:表示状态改变，当状态改变时，触发对应的组件刷新

自定义组件：类似自定义控件

@Component
struct 自定义组件名 {
    ...
    build(){
        ...
    }
    ...
}

@Entry 自定义组件当做页面的默认入口组件，加载页面是首先创建并呈现。一个页面有且只能有一个。 

自定义组件生命周期

被@Component修饰

1. aboutToAppear() :创建组件后，执行build之前：可以对展示的数据初始化、申请资源等。
2. aboutToDisappear()：自定义组件实例被销毁时调用，可以用于销毁资源。

注：方法私有，在特定时间由系统调用，无法手动通过代码调用。

页面入口组件生命周期：

被@Entry修饰

1. aboutToAppear():
2. onPageShow():页面显示
3. onBackPress():返回back
4. onPageHide():页面消失 Home、Back等
5. aboutToDisappear():

UI控制渲染

条件渲染：if...else if ...else

循环渲染：ForEach

状态管理

@State：表示状态改变

@Link: @Link修饰的变量可以喝父组件的@State变量建立双向数据绑定。任何一方所做的修改都会反应给另一方。

另：$创建引用

​​​​​​​网址：文档中心

---

以下内容为2024年1月30日补充

声明式UI

特征：

• 声明式描述
• 状态驱动视图更新

自定义组件

声明：

@Entry //作为页面入口
@Component 
struct 自定义组件名 {
   build(){
      Column(){
        //自定义组件的具体内容
      }
   }
}

@Builder装饰器，来修饰一个函数，快速生成布局内容，从而可以避免重复的UI描述内容

@Link变量不能在组件内部进行初始化

开发注意事项 

不是所有的开发注意事项，刚开始接触，看到需要注意的点，就会记下来，后续会补充追加，用词可能也不准确，确保能看懂即可。

1.DevEco Studio开发过程中支持页面（组件）预览，但，预览的页面（组件）需要被@Entry标记，非@Entry标记的普通组件（@Entry标记的组件为入口页面）需要预览的话需要被@Preview，否则不支持预览；

 代码：

至此，已经可以完成基本的harmony应用页面开发。