适用人群 ：有 React/Vue/TS 基础的前端开发者
核心策略：用前端知识做类比，只记差异点和考试陷阱
第 1 部分：概念快速映射（5 分钟）
把鸿蒙概念映射到你熟悉的前端概念上，大幅降低记忆成本：
| 鸿蒙 | 前端类比 | 一句话说明 |
|---|---|---|
| ArkTS | TypeScript + 装饰器语法糖 | 就是 TS，多了 @State/@Prop 等装饰器 |
| ArkUI | 声明式 UI（类似 React/Vue3） | 用函数/组件描述 UI，状态驱动视图 |
| @Entry | export default / 页面入口 |
一个页面只能有一个，标记页面入口 |
| @Component | function Component() / 自定义组件 |
普通组件装饰器，没有页面生命周期 |
| @State | useState |
组件内部状态，必须给初始值 |
| @Prop | props（单向数据流） |
父传子，子组件只读 |
| @Link | v-model / 双向绑定 |
父子双向同步 |
| @Provide/@Consume | React Context / Provide/Inject | 跨层级共享数据，不用逐层传 |
| @Builder | 抽离 UI 函数 / Render Prop | 复用 UI 结构，不是组件 |
| UIAbility | 类似 Android Activity / 小程序 Page | 应用的基本组成单元，管理生命周期 |
| router | react-router / vue-router |
页面跳转，有 pushUrl 和 replaceUrl |
| HAP | .apk / 小程序包 |
鸿蒙应用打包单元 |
| DevEco Studio | VS Code + 专属插件 | IDE，有预览器、模拟器、真机调试 |
第 2 部分：高频考点速记（15 分钟）
一、判断题 · 生死线（记牢这些"陷阱"）
| 题目表述 | 答案 | 前端类比 / 记忆口诀 |
|---|---|---|
@Component 组件支持 onPageShow/onBackPress |
❌ 错 | 只有 @Entry 页面才有页面生命周期，普通组件没有 |
@Entry 页面可以有多个 |
❌ 错 | 一个页面只能一个 @Entry，就像 export default 只能有一个 |
@State 变量可以不给初始值 |
❌ 错 | 相当于 useState() 不给初始值，必须给 |
| 首选项 Preferences 的 Key 可以重复 | ❌ 错 | Key 唯一，最大长度 80 字节 |
router.pushUrl() 页面栈最大 32 层 |
✅ 对 | 记住数字 32 |
使用 http 请求必须 订阅 headersReceive 才成功 |
❌ 错 | 不是必须的，正常发请求就行 |
Web 组件对所有网页都可以用 zoom() |
❌ 错 | 有限制，不是全部 |
| 预览器可以预览网络、数据库、传感器 | ❌ 错 | 这些必须用模拟器或真机，预览器只能看 UI |
| 应用由一个或多个 HAP 组成 | ✅ 对 | HAP 是基本单元 |
| 每一个自定义组件都有自己的生命周期 | ✅ 对 | 组件级生命周期独立存在 |
| 本地模拟器可以在虚拟机内运行节省资源 | ❌ 错 | 需要一定硬件资源 |
二、单选题 · 送分题（秒选）
| 考点 | 答案 | 前端记忆法 |
|---|---|---|
| 页面入口装饰器 | @Entry |
= export default |
| 自定义组件装饰器 | @Component |
= function Component() |
| 自定义弹窗装饰器 | @CustomDialog |
弹窗专用 |
| 路由模块导入 | import router from '@ohos.router' |
类似 import { useRouter } |
| 跳转并销毁当前页 | router.replaceUrl() |
= router.replace() |
| 跳转并保留当前页（压栈） | router.pushUrl() |
= router.push()，最大 32 层 |
| 页面路径配置文件 | main_pages.json |
= routes.ts |
| 模块配置文件 | module.json5 |
模块级配置 |
| 应用全局配置文件 | app.json5 |
= package.json |
| 胶囊型按钮 | ButtonType.Capsule |
样式枚举 |
| 网络图片权限 | ohos.permission.INTERNET |
类似 android.permission.INTERNET |
| 首选项 Key 最大长度 | 80 字节 | 死记 |
| 不能包含子组件的组件 | LoadingProgress |
纯展示组件，类似 <img> 不能嵌套 |
| List 滑动偏移量事件 | onScroll |
滚动监听 |
| Video 播放网络视频权限 | ohos.permission.INTERNET |
同网络请求 |
| Video 获取视频时长的事件 | onPrepared |
不是 onStart |
bundleName 作用 |
标识应用唯一性 | = package.name |
| UIAbility 默认启动模式 | standard | 不是 singleton（单例是另外配的） |
| 发起网络请求导入模块 | import http from '@ohos.net.http' |
标准库 |
| 提交表单数据请求方式 | RequestMethod.POST |
常规 |
| 常量命名规范 | 全大写下划线 | MAX_COUNT |
| 类名命名规范 | 大驼峰 | MyClass |
| 变量命名规范 | 小驼峰 | myVariable |
三、多选题 · 重灾区（最容易丢分）
| 考点 | 正确答案 | 避坑指南 |
|---|---|---|
| 可滚动的容器组件 | Scroll、List、Grid |
❌ Row、Column 默认不可滚动！这是最大陷阱 |
| UIAbility 生命周期 | onCreate、onDestroy、onForeground、onBackground |
❌ 不含 onPageShow/onPageHide，那是页面生命周期 |
页面生命周期 （@Entry 组件） |
onPageShow、onPageHide、onBackPress |
和 UIAbility 生命周期分开记 |
| module.json5 包含的信息 | Ability 配置、设备类型、权限列表 | ❌ 不含 应用包名和版本号（在 app.json5） |
| ArkTS 声明式开发基本组成 | 装饰器、自定义组件、UI 描述、内置组件、属性方法、事件方法 | ✅ 全选，送分题 |
| 正确的组件层次 | Text > Span、Button > Column > Image |
❌ Image 不能包含子组件 |
| ForEach 参数 | 数组、lambda 生成子组件、唯一键值生成函数 | 类似 array.map((item, index) => ...) |
| 文本组件属性 | fontColor、fontSize、fontStyle、fontWeight、fontFamily |
✅ 全选 |
| Tabs 与 TabContent | TabContent 宽 = Tabs 的 barWidth、tabBar 支持 @Builder、一个 TabsController 不能控制多个 Tabs |
注意细节描述 |
| 响应式布局断点 | xs、sm、md、lg、xl、xxl |
✅ 全选，6 个都要记 |
| Promise 特点 | 支持链式调用、状态一旦完成不可变 | ❌ 不支持同步操作 、不能暂停 |
| 代码自动生成 | 快速重写父类、生成构造器、生成 getter、生成 setter | ✅ 全选 |
| 数据管理方式 | 分布式键值数据库、分布式数据对象、用户首选项、关系型数据库 | ✅ 全选 |
| 自由流转体验 | 媒体播控、应用接续、跨设备拖拽、跨设备剪贴板、服务互通 | ✅ 全选 |
第 3 部分：配置文件与生命周期（5 分钟）
三个核心配置文件
ts
// 1. app.json5 ------ 应用全局配置（= package.json）
{
"app": {
"bundleName": "com.example.myapp", // 唯一标识，类似 package.name
"versionCode": 1,
"versionName": "1.0.0"
}
}
// 2. module.json5 ------ 模块配置（= vite.config / 模块级配置）
{
"module": {
"name": "entry",
"type": "entry",
"abilities": [...], // Ability 列表
"deviceTypes": [...], // 支持的设备类型
"requestPermissions": [...] // 权限申请列表
}
}
// 3. main_pages.json ------ 页面路由配置（= routes.ts）
{
"src": ["pages/Index", "pages/Detail"]
}生命周期对比（考试必考）
UIAbility 生命周期（应用级） 页面生命周期（@Entry 组件级）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
onCreate() ← 实例创建 onPageShow() ← 页面显示
onDestroy() ← 实例销毁 onPageHide() ← 页面隐藏
onForeground() ← 进入前台 onBackPress() ← 返回键
onBackground() ← 进入后台核心区别 ：UIAbility 是"应用进程级"，页面生命周期是"页面级"。多选题经常混着考，必须分开记。
启动模式
| 模式 | 说明 | 类比 |
|---|---|---|
| standard | 每次启动新建实例（默认） | = 普通页面跳转 |
| singleton | 单实例，已存在就复用 | = 单例模式 |
| specified | 按指定 Key 匹配实例 | = 带 ID 的页面复用 |
第 4 部分：前端开发者易错点（5 分钟）
1. 布局思维转换
- 前端：
display: flex+flex-direction - 鸿蒙：直接
Row()（横向 Flex）或Column()（纵向 Flex），没有display属性 Row/Column默认不可滚动 ，需要滚动必须包一层Scroll或用List
2. 状态管理差异
ts
// 前端 React
const [count, setCount] = useState(0);
// 鸿蒙 ArkTS
@State count: number = 0; // 必须给初始值！必须声明类型！
// 直接 this.count++ 即可，不需要 setState3. 路由跳转差异
ts
// 前端：router.push('/detail')
// 鸿蒙：
router.pushUrl({ url: 'pages/Detail' }); // 压栈，保留当前页
router.replaceUrl({ url: 'pages/Detail' }); // 替换，销毁当前页
router.back(); // 返回4. 网络请求
ts
import http from '@ohos.net.http'; // 模块名是 @ohos.net.http，不是 axios
// 必须先在 module.json5 申请 ohos.permission.INTERNET 权限5. 子组件限制
Image、LoadingProgress、Text（不含 Span 时）不能包含子组件- 类似前端的
<img>、<input>不能嵌套子元素
第 5 部分：考前 2 分钟 · 口诀速记
生命周期口诀 ：
"Ability 四兄弟：Create、Destroy、Foreground、Background；
页面三剑客：Show、Hide、BackPress。"
多选题防坑口诀 ：
"滚动只有 Scroll/List/Grid，Row/Column 不滚动；
module.json5 管模块，app.json5 管全局；
@Component 没页面命，@Entry 才有 onPageShow。"
判断题防坑口诀 ：
"Key 唯一 80 字节，32 层栈要牢记；
预览器不看网络库，模拟器真机才靠谱；
replaceUrl 销毁页，pushUrl 压栈留后路。"