学习TS + ArkTS 快速入门

学习TS

1、函数
2、类(class)
3、继承

类的继承需要使用关键字extends

子类构造器中需使用super()调用父类构造器对继承自父类的属性进行初始化。

在子类中可以使用this关键字访问继承自父类的属性和方法。

在子类中可以使用super关键字访问父类定义的方法。

4、访问修饰符

private修饰的属性或方法是私有的,只能在声明它的类中的被访问。

protected修饰的属性或方法是受保护的,只能在声明它的炎和其子类中被访问。

public修饰的属性或方法是公有的,可以在任何地方被访问到,默认所有的属性和方法都是public的。

5、 接口(interface)

接口使用 interface 关键字定义,通常接口中只会包含属性和方法的声明,具体的细节由其实现类完成。

接口实现需要用 implements 关键字

6、枚举

ArkTS 快速入门

1、@State

组件装饰器@State 状态变量

组件装饰器@Component 自定义组件

2、自定义组件

各部分语法说明如下:

struct关键字

struct是ArkTS新增的用于自定义组件或者自定义弹窗的关键字。其声明的数据结构和TS中的类十分相似,可包含属性和方法。

build方法

build()方法用于声明自定义组件的UI结构。

组件属性

组件属性可用作自定义组件的参数,使得自定义组件更为通用。

@Compnent 装饰器

@Component 装饰器用于装饰struct 关键字声明的数据结构。struct 被@Component 装饰后才具备组件化的能力。

注:装饰器是Typescript中的一种特殊语法,常用于装饰类、方法、属性,用于修改或扩展其原有的行为。

在学完白定义组件的语法之后,我们会发现前文案例中的每个页面实际上都是一个自定义组件,这应该如何理解呢?

每个页面是逐层嵌套的关系

除此之外,前边的每个案例还会多出一个@

Entry装饰器,那这个@Entry装饰器的作用又是啥呢?

在鸿蒙应用中,每个页面都是由一些列组件组合而成的,并且这些组件都是逐层嵌套的,因此这些组件最终形成了一个组件树的结构,如下图所示

我们前边所编写的每个页面就相当于是组件树的根节点,而 @Entry 装饰器的作用就是标识该组件为组件树的根节点,也就是一个页面的入口组件。

3、循环渲染

ForEach 循环渲染的语法如下

各参数的含义如下

arr

需要进行循环渲染的数据源,必须为数组类型,例如上述案例中的

@State options:string\[\]="苹果","桃子","香蕉","橘子";

itemGenerator

组件生成函数,用于为 arr 数组中的每个元素创建对应的组件。该函数可接受两个参数,分别是

·item:arr数组中的数据项

·index(可选):arr数组中的数据项的索引

keyGenerator (可选 )

key生成函数,用于为arr数组中的每个数据项生成唯一的key。

key的作用

ForEach在数组发生变化(修改数组元素或者向数组增加或删除元素)时,需要重新渲染组件列表,在重新渲染时,它会尽量复用原来的组件对象,

具体逻辑如下

而不是重新渲染整个组件列表。key的作用就是辅助ForEach 完成组件对象的复用。

ForEach 在进行初次染时,会使用keyGenerator为数组中的每个元素生成一个唯一的Skey,并将key作为组件对象的标识。当数组发生变化导致ForEach 需要重新清染时,ForEach 会再次使用keyGenerator为每个元察重新生成一遍key,然后ForEach 会检直新生成的Skey在上次渲染时是否已经存在,若存在,ForEach就会认为这个key对应的数组元素没有发生变化,那它就会直接复用这个key所对应的组件对象;若不存在,ForEach就会

认为这个key对应的元素发生了变化,或者该元素为新增元素,此时,就会为该元素重新创建一个组件对象。

开发者可以通过keyGenerator函数自定义key的生成规则。如果开发者没有定义keyGenerator函数,则系统会使用默认的key生成函数,即

(item: any, index: number) => { return index + '' + JSoN.stringify(item); }

在某些情况下默认的key生成函数,会导致界面渲染效率低下,此时可考虑通过keyGenerator函数自定义生成逻辑,例如如下场景

状态变量数组定义如下

@State arr:string\[\] = "zhangsan","lisi","wangwu"

相关推荐
人工智能培训1 小时前
具身智能:让人工智能拥有物理世界感知能力
大数据·人工智能·学习·算法·机器学习
叼烟扛炮1 小时前
Linux 学习笔记(二十三):深入 Ext 文件系统(下)—— 原理、缓存与软硬链接
linux·笔记·学习
stolentime2 小时前
SOS DP学习笔记
c++·笔记·学习·算法·贪心算法·动态规划·二进制
江苏世纪龙科技2 小时前
从“拆不开“到“看得见“:新能源汽车原理教学的一种解法
学习
minglie13 小时前
电枢的主题和概念
学习·1024程序员节
叼烟扛炮3 小时前
Linux 学习笔记(二十二):深入 Ext 文件系统(上)—— 磁盘、块与神秘的 inode
linux·笔记·学习
坤坤子吖4 小时前
C++继承:继承的基本用法与访问规则
开发语言·c++·笔记·学习
代码山河4 小时前
键盘输入与输出:Scanner与System.out详解
java·学习·架构·教程·面向对象·项目
一楼的猫4 小时前
活动会议照片直播云相册:服务形式与适用场景
学习