适用人群：有 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 分钟）

三个核心配置文件

// 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. 状态管理差异

// 前端 React
const [count, setCount] = useState(0);

// 鸿蒙 ArkTS
@State count: number = 0;  // 必须给初始值！必须声明类型！
// 直接 this.count++ 即可，不需要 setState

3. 路由跳转差异

// 前端：router.push('/detail')
// 鸿蒙：
router.pushUrl({ url: 'pages/Detail' });    // 压栈，保留当前页
router.replaceUrl({ url: 'pages/Detail' }); // 替换，销毁当前页
router.back();                              // 返回

4. 网络请求

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 压栈留后路。”