2、ArkTS 是什么?鸿蒙最强开发语言语法全讲解(附实操案例)


ArkTS 是什么?鸿蒙最强开发语言语法全讲解(附实操案例)

你听说过 TypeScript,也听过 JavaScript,但你真的了解鸿蒙背后的"灵魂语言"ArkTS 吗?今天这篇文章带你深入掌握 ArkTS 的语法精髓,并用实战项目验证它的强大。


🧠 一、什么是 ArkTS?

ArkTS = TypeScript + 鸿蒙独有语法能力

它是华为为 HarmonyOS NEXT 打造的编程语言,兼容 TypeScript 语法的同时:

  • 引入了全新的响应式开发范式(@State、@Prop 等)
  • 增强了组件式开发能力
  • 更适配多端运行(一次开发,多设备部署)

🔎 二、ArkTS 和 TypeScript 有啥区别?

对比项 TypeScript ArkTS
语法来源 JS 超集 TS 超集
响应式 需框架支持(如 Vue) 内建响应式装饰器(@State 等)
UI 声明 外部模板(如 JSX) 纯函数式构建 UI
编译目标 JS 鸿蒙ArkTS运行时

📦 三、ArkTS 基础语法速览

less 复制代码
@Entry
@Component
struct HelloWorld {
  @State text: string = '你好 ArkTS!'

  build() {
    Column() {
      Text(this.text)
      Button('点击我')
        .onClick(() => {
          this.text = '按钮已点击'
        })
    }
  }
}

✅ 核心语法说明:

  • @Entry:程序入口组件
  • @Component:定义为 UI 组件
  • @State:响应式状态,状态变更自动更新 UI
  • build():类似 Vue 的模板函数,声明 UI

⚙️ 四、组件通信:@Prop/@Link/@Provide/@Consume

示例:父传子

less 复制代码
// 父组件
@Component
struct Parent {
  build() {
    Child({ msg: '来自父组件的消息' })
  }
}

// 子组件
@Component
struct Child {
  @Prop msg: string

  build() {
    Text(this.msg)
  }
}

@Prop 就是 props,父传子专用;支持基本类型和对象传递。


🧪 五、实操项目:ArkTS 构建 ToDo 应用

✅ 功能需求:

  • 添加任务
  • 展示任务列表
  • 删除任务项

✅ 项目代码简版:

less 复制代码
@Entry
@Component
struct TodoApp {
  @State task: string = ''
  @State list: Array<string> = []

  build() {
    Column() {
      Row() {
        TextInput({ placeholder: '请输入任务' })
          .onChange(v => this.task = v)
        Button('添加')
          .onClick(() => {
            if (this.task) {
              this.list.push(this.task)
              this.task = ''
            }
          })
      }

      ForEach(this.list, (item, index) => {
        Row() {
          Text(item)
          Button('删除').onClick(() => this.list.splice(index, 1))
        }
      }, item => item)
    }
  }
}

🎯 实操亮点:

  • ArkTS 的响应式状态管理无需外部框架
  • List 渲染用 ForEach 实现,和 React/Vue 不同但易懂
  • 没有 class,没有 render 函数,全部声明式结构

💡 六、ArkTS 开发注意事项

项 说明
类型系统 和 TS 一致,建议开启严格模式
生命周期 @Component 支持生命周期函数(如 onAppear)
不支持 暂不支持 any, eval 等弱类型写法
编译器 使用 Ark Compiler 编译为鸿蒙原生字节码

🧭 七、总结与展望

  • ✅ ArkTS 是鸿蒙系统的"第一语言"
  • ✅ 上手门槛低、语法现代、支持响应式和声明式开发
  • ✅ 未来所有 HarmonyOS NEXT 应用将优先支持 ArkTS

📘 下篇预告

《构建你的第一个鸿蒙组件化 UI 页面》------打造可复用、可组合的鸿蒙自定义组件,UI 设计师看了都说香!


相关推荐
迅猛龙办公室17 分钟前
Python输出当前计算机的系统日期和时间
开发语言·前端·python
小狼1545434 分钟前
浏览器扩展脚本为什么有时候不生效:注入时机、iframe 和单页路由,多多开票助手
前端·chrome
じòぴé南冸じょうげん1 小时前
油猴脚本突然发现变成灰色了,无法使用?页面不生效?刷新页面没反应?
前端
步行cgn2 小时前
Spring 全注解开发详解
java·后端·spring
Csvn2 小时前
组合式 API(Composition API)
前端
HwJack203 小时前
【共创稿事节】HarmonyOS 7空间信息层级:焦点、景深与注意力引导
3d·华为·harmonyos·空间计算
火柴就是我4 小时前
Android 打包报错 25.0.3
android·前端
BD_Marathon4 小时前
消息对象中字段的说明
java·前端·python
八荒启·交互动画4 小时前
Web特效025—用 Canvas 2D 做Web特效的定义与边界:这支画笔能做到哪一步
前端·webgl·网页特效·八荒启-交互动画·八荒启
Ai-_Man4 小时前
您您这可以把Dola的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。用AI导出鸭,答案是可以的
开发语言·前端·人工智能·小程序