鸿蒙学习第二篇—了解 ArkTS 语言.pdf

鸿蒙学习第二篇—了解ArkTS语言

前言：上一篇文章《鸿蒙学习第一篇—了解DevEcoStudio》介绍了鸿蒙的开发工具DevEco

Studio。在学会使用了鸿蒙的开发工具之后，接下来让我们了解一下鸿蒙的开发语言。这篇文章

就向大家介绍了鸿蒙系统的开发语言—ArkTS。

一、ArkTS介绍

历程：Mozilla创造了JS，Microsoft创建了TS，Huawei进一步推出了ArkTS。

(Ark：方舟)

1.起源：

JavaScript（JS）是由Mozilla创建，最初用于解决网页逻辑交互问题，成为Web开发的基础。

TypeScript（TS）是由Microsoft创建的，旨在增强JS，引入类型系统、类型检查等，提高大型应

用程序的可维护性。

React.js和Vue.js等前端框架引入了声明式UI和响应式编程的概念，使Web应用程序更容易开发和

维护。

2.TypeScript（TS）的演进：

TS引入了类型系统和类型检查，提高了代码的可维护性和错误检测范围。

声明文件（DeclarationFiles）支持了接口和自定义类型的管理，增强了模块之间的协作和复

用。

TS提供了编辑器、编译器和IDE插件等工具，提高了开发效率。

TS兼容ECMA标准，使TS应用能够编译成纯JS应用，并在标准JS引擎上运行。

3.ArkTS的演进

ArkTS建立在JS和TS的基础之上，扩展了声明式UI开发范式和状态管理，提供更简洁和自然的开

发方式。

ArkTS引入了渲染引擎的增强，包括平台无关的自绘制机制、声明式UI后端设计、动态布局等，

以提高性能体验。

进一步的优化包括代码预编译、高效FFI-ForeignFunctionInterface、引擎极小化等。

ArkTS还构建了跨OS平台的基础设施，以支持不同设备上的部署。

4.优点和创新

ArkTS整合了JS和TS的生态，使开发者能够使用熟悉的语言和工具。

基于ArkTS的声明式UI开发范式提供了更简洁、自然和高性能的开发体验。

渲染引擎和运行时的优化进一步提高了性能体验，使应用程序能够在不同设备上运行。

二、ArkTS声明式开发范式

如下图所示的代码示例，UI界面会显示两段文本和一个按钮，当开发者点击按钮时，文本内

容会从HelloWorld变为‘HelloArkUI’

这个示例中所包含的ArkTS声明式开发范式的基本组成说明如下：

装饰器

用来装饰类、结构体、方法以及变量，赋予其特殊的含义，如上述示例中@Entry、

@Component、@State都是装饰器。具体而言，@Component表示这是个自定义组件；

@Entry则表示这是个入口组件；@State表示组件中的状态变量，此状态变化会引起UI变

更。

自定义组件

可复用的UI单元，可组合其它组件，如上述被@Component装饰的structHello。

UI描述

声明式的方式来描述UI的结构，如上述build()方法内部的代码块。

内置组件

框架中默认内置的基础和布局组件，可直接被开发者调用，比如示例中的Column、Text、

Divider、Button。

事件方法

用于添加组件对事件的响应逻辑，统一通过事件方法进行设置，如跟随在Button后面的

onClick()。

属性方法

用于组件属性的配置，统一通过属性方法进行设置，如fontSize()、width()、height()、

color()等，可通过链式调用的方式设置多项属性。

三、状态管理

1.状态管理概述

在声明式UI编程框架中，UI是程序状态的运行结果，用户构建了一个UI模型，其中应用的运行

时的状态是参数。当参数改变时，UI作为返回结果，也将进行对应的改变。这些运行时的状态变化

所带来的UI的重新渲染，在ArkUI中统称为状态管理机制。

View(UI)：UI渲染，一般指自定义组件的build方法和@