鸿蒙初体验 - 技术栈

最近两天简单看了一下 HarmonyOS 应用开发文档，其实对于我这样的 "大龄程序员"，已经很久没有对一款 UI 编程框架有这样的学习热情了，忍不住叨叨两句。

官方文档

一门全新技术的官方文档是中文，好感动。点一下隔壁 Android，中文文档一定是滞后的，每次得手动切回 English 确认一下。

目前 HarmonyOS 官网文档是基于 API 9，Hormony Next 版本的文档需要华为授权账号才可以查看。

而 OpenHarmony 开发文档是基于 API 10。

就我观察到的，@Prop 在 API 9 的文档中不支持 Class，但我代码测试是支持的，在 API 10 中明确说明了支持 Class。另外，ArkTS 在 API 10 也有一定 "增强" 和 "限制" 。

这里建议优先学习 API 10 ， 反正学了 API 9，回头还是要升级的嘛。

另外，官网下载的 DevEco 是无法调整编译版本到 API 10 的。你需要到 OpenHarmony 网站去下载 4.0 Release 版本的 IDE，目前最新 Build Verision 4.0.0.600。

如果你司是华为合作伙伴，应该没有这些问题，还有 VIP 版本 IDE，表示羡慕。

JS/TS/ArkTs ？

背景：我是零前端开发经验，并且一直厌恶 JavaScript 这种动态语言。

TypeScript 是在 JavaScript 的基础上通过添加类型定义扩展而来，ArkTS 在 TypeScript 的基础上进一步扩展，主要是限制了动态类型。动态类型一定会造成更多的运行时错误，浪费更多的运行时性能，对程序员的稳定性和性能完全没有好处。

从 API 10 开始，ArkTS 进一步强化了静态检查，包括强制使用静态类型，禁止运行时改变对象布局，限制运算符语义等等。从 TypeScript 到 ArkTS 的适配规则这份文档里大概列举了几十条 ArkTS 对 TS 的限制。

肉眼可见，ArkTS 越来越像的是 Java，而不是 TS。所以不妨把 ArkTS 当做一门全新的语言来学习。

社区里也看到一些 Kotlin/Js 的曲线救国方案，qdsfdhvh/test-kmp-in-ohos ，bennyhuo/ktor-for-ohos ，还有传言华为自研的仓颉，可能 JS/TS 的学习优先级并没有那么高。

以上纯属尚无完整鸿蒙项目开发背景下的个人意见。

状态管理

状态管理，或者说数据驱动是声明式 UI 的核中核，这两天也是先上手学习了 ArkUI 的状态管理。

由于之前断断续续的看过一些 SwiftUI，他两状态管理的思路出奇的一致。

less 复制代码

struct FoodListScreen: View {
    @State private var editMode: EditMode = .inactive
    @AppStorage(.foodList) private var foodList = Food.examples
    @State var selectedFoodId = Set<Food.ID>()
    @State private var sheet: Sheet?
    
    var isEditMode: Bool { editMode.isEditing }
    
    var body: some View {
        VStack(alignment: .leading) {
            titleBar
            
            List($foodList, editActions: .all, selection: $selectedFoodId, rowContent: buildFoodRow)
                .listStyle(.plain)
                .background {
                    RoundedRectangle(cornerRadius: 10)
                        .fill(.groupBg2)
                        .ignoresSafeArea(.container, edges: .bottom)
                }
                .padding(.horizontal)
        }
        .background(.groupBg)
        .environment(.editMode, $editMode)
        .sheet(item: $sheet)
    }
}

scss 复制代码

@Component
struct ArticleList {
  @State simpleList: Array<number> = [1, 2, 3, 4, 5]

  build() {
    Column() {
      ForEach(this.simpleList, (item: string) => {
        ArticleSkeletonView()
          .margin({top: 20})
      })
    }
    .padding(20)
    .width('100%')
    .height('100%')
  }
}

ArkUI 也是标准的 MVVM 架构

可以先把状态管理捋一捋。在对状态管理有了基本认知之后，再去深入学习 ArkUI 的细枝末节。

吐槽环节

IDE 的智能提示不够完善，constructor() 目前只能手搓。

刚刚装上了 Copilot，这也不是问题了。

用了半天，Copilot 可能还不认识 ArkTs，时而提示出 JS 语法，时而提示出 SwitUI 语法，时而提示出 Compose，甚至还提示过 XML View 。

误把 string() 写成了 string，编译运行无问题，只是 UI 表现有问题，不知道 API 10 是否会增强这类的编译期检查。

API 10 中 ArkTS 对于语法特性的限制过于严格，例如运算符只能用于数值，取消对于数组的 for in 语法，不支持 with 语句等，其实还是可以通过编译期语法糖来实现的，这也是 Kotlin 大受欢迎的原因。

还没有实战写项目，暂时没有可以吐槽的了。

小意外

发现了一个目前为止还没在其他 UI 框架中看到过的小特性，ArkUI 支持 单复数的字符串匹配。

在 plural.json 中配置：

perl 复制代码

{
    "plural":[
        {
            "name":"eat_apple",
            "value":[
                {
                    "quantity":"one",
                    "value":"%d apple"
                },
                {
                    "quantity":"other",
                    "value":"%d apples"
                }
            ]
        }
    ]
}

Text($r('app.plural.eat_apple', 5, 5))  => 5 apples

结束

暂时想不到什么可以分享的了，后续学习过程中，想叨叨的时候再写了。