3 第1章：ArkTS简介与开发环境搭建
3.1 🎯 学习目标
- 了解HarmonyOS与ArkTS的关系
- 理解ArkTS的语言特性
- 掌握DevEco Studio的安装与配置
- 创建并运行第一个ArkTS应用
3.2 1.1 HarmonyOS与ArkTS简介
3.2.1 📱 HarmonyOS概述
HarmonyOS（鸿蒙操作系统）是华为自主研发的分布式操作系统，具有以下核心特性：
| 特性 | 说明 |
|---|---|
| 分布式架构 | 跨设备协同，多设备融为一体 |
| 原子化服务 | 免安装，即点即用 |
| 流畅体验 | 确定性调度，低时延 |
| 安全可靠 | 多层次安全机制 |
3.2.2 🔷 ArkTS语言简介
ArkTS是HarmonyOS优选的主力应用开发语言，基于TypeScript扩展而来。
graph LR
JS[JavaScript] --> TS[TypeScript]
TS --> ArkTS[ArkTS]
ArkTS --> ArkUI[ArkUI框架]
ArkUI --> App[HarmonyOS应用]
style ArkTS fill:#C02020,color:#fff
style ArkUI fill:#0066CC,color:#fffArkTS的核心优势：
- 自然流畅的声明式UI：通过简洁的UI描述语法，让界面开发更直观
- 强大的类型系统：静态类型检查，提前发现错误
- 高性能运行时：方舟编译器AOT优化，执行效率更高
- 丰富的状态管理：多种装饰器支持复杂状态场景
- 完善的生态：完整的HarmonyOS API支持
3.2.3 🆚 ArkTS与TypeScript/JavaScript对比
| 特性 | JavaScript | TypeScript | ArkTS |
|---|---|---|---|
| 类型系统 | 动态类型 | 静态类型(可选) | 静态类型(强制) |
| UI范式 | 命令式 | 命令式 | 声明式 |
| 状态管理 | 需第三方库 | 需第三方库 | 内置装饰器 |
| 编译方式 | 解释执行 | 编译为JS | AOT/JIT混合 |
| 运行环境 | 浏览器/Node.js | 浏览器/Node.js | 方舟运行时 |
3.3 1.2 开发环境搭建
3.3.1 🛠️ 系统要求
Windows系统： - 操作系统：Windows 10 64位 / Windows 11 - 内存：建议16GB及以上 - 硬盘：至少10GB可用空间 - 分辨率：1280×800及以上
macOS系统： - 操作系统：macOS 12.0及以上 - 内存：建议16GB及以上 - 硬盘：至少10GB可用空间
3.3.2 📥 安装DevEco Studio
DevEco Studio是HarmonyOS的官方集成开发环境（IDE），基于IntelliJ IDEA定制。
安装步骤：
- 访问华为开发者联盟官网下载页面
- 下载DevEco Studio最新版本
- 运行安装程序，按向导完成安装
- 首次启动时会自动下载SDK和工具链
🖥️ 开发环境检查清单
请确认你的开发环境满足以下要求：
3.4 1.3 创建第一个ArkTS应用
3.4.1 🚀 新建项目
- 打开DevEco Studio，点击 Create Project
- 选择模板：Application → Empty Ability
- 填写项目信息：
| 配置项 | 说明 | 示例值 |
|---|---|---|
| Project name | 项目名称 | MyFirstApp |
| Bundle name | 应用包名 | com.example.myfirstapp |
| Save location | 项目保存路径 | D: |
| Compile SDK | 编译SDK版本 | 12.0.0 |
| Model | 应用模型 | Stage模型(推荐) |
| Language | 开发语言 | ArkTS |
3.4.2 📁 项目结构说明
MyFirstApp/
├── AppScope/ # 应用全局配置
│ ├── app.json5 # 应用配置
│ └── resources/ # 全局资源
├── entry/ # 主模块
│ ├── src/main/
│ │ ├── ets/ # ArkTS源代码
│ │ │ ├── entryability/ # 入口Ability
│ │ │ └── pages/ # 页面目录
│ │ │ └── Index.ets # 首页
│ │ ├── resources/ # 模块资源
│ │ └── module.json5 # 模块配置
│ └── test/ # 单元测试
├── oh_modules/ # 依赖模块
└── build-profile.json5 # 构建配置Ability是什么？
Ability是HarmonyOS应用的基本组成单元，分为： - UIAbility：有界面的能力，对应一个应用窗口 - ExtensionAbility：特定场景的能力（如分享、画中画等）
3.4.3 ✏️ 第一个ArkTS程序
打开 entry/src/main/ets/pages/Index.ets，你会看到以下代码：
// Index.ets - 应用首页
@Entry
@Component
struct Index {
@State message: string = 'Hello World'
build() {
Row() {
Column() {
Text(this.message)
.fontSize(50)
.fontWeight(FontWeight.Bold)
}
.width('100%')
}
.height('100%')
}
}代码解析：
| 代码片段 | 说明 |
|---|---|
| @Entry | 标记当前组件为页面入口 |
| @Component | 标记当前结构体为自定义组件 |
| struct Index | 定义组件结构体（类似类） |
| @State message | 状态变量，变化时自动刷新UI |
| build() { ... } | 组件的UI描述方法（声明式） |
3.4.4 ▶️ 运行应用
使用模拟器运行：
- 点击工具栏 Device Manager
- 创建或启动一个模拟器
- 选择目标设备，点击 Run
使用真机运行：
- 手机开启开发者模式
- 启用USB调试
- 连接电脑，授权调试
- 点击 Run
3.5 1.4 ArkTS核心概念
3.5.1 🧩 声明式UI
ArkTS采用声明式UI范式，用代码描述”想要什么界面”，而不是”怎么去绘制界面”。
命令式UI（传统方式）
// 先创建对象
const text = new Text('Hello');
// 再设置属性
text.setFontSize(30);
text.setFontColor('#000000');
// 最后添加到界面
container.addView(text);
需要一步步操作UI组件
声明式UI（ArkTS方式）
// 直接描述想要的界面
Text('Hello')
.fontSize(30)
.fontColor('#000000')
直接描述最终界面状态
3.5.2 🔄 状态驱动UI更新
ArkTS的核心思想是：状态变化自动驱动UI更新
// 状态变量
@State count: number = 0
// UI描述（自动关联状态）
Text(`计数：${this.count}`)
.fontSize(30)
// 按钮点击修状态
Button('增加')
.onClick(() => {
this.count++ // 修改状态后，UI自动更新！
})🎮 互动演示：状态驱动UI
点击按钮，观察状态变化如何自动更新UI：
// ArkTS代码示例
@Entry
@Component
struct Demo {
@State count: number = 0
build() {
Column() {
Text(`计数：${this.count}`)
.fontSize(30)
.fontColor('#FFFFFF')
Button('增加 +1')
.onClick(() => { this.count++ })
}
}
}
计数：0
3.6 📝 本章小结
本章我们学习了：
- HarmonyOS与ArkTS的关系：ArkTS是HarmonyOS的优选开发语言
- ArkTS的优势：声明式UI、强类型、高性能、丰富的状态管理
- 开发环境搭建：DevEco Studio的安装与配置
- 第一个应用：创建并运行Hello World程序
- 核心概念：声明式UI和状态驱动UI更新
3.7 ✏️ 练习
- 安装DevEco Studio并创建一个Empty Ability项目
- 修改Index.ets，将”Hello World”改为你的名字
- 添加一个按钮，点击后修改文字内容
- 尝试在模拟器或真机上运行你的应用