「鸿蒙入门」1_TS基础语法简述 {message type="info" content="本篇主要讲述的是TS的语法基础和TS在ArkTS中的应用（区别）如果您有足够的基础，可以跳过本篇"/}一、初识ArkTS语言ArkTS是HarmonyOS优选的主力应用开发语言。ArkTS围绕应用开发在TypeScript（简称TS）生态基础上做了进一步扩展，继承了TS的所有特性，是TS的超集。因此，在学习ArkTS语言之前，建议开发者具备TS语言开发能力。当前，ArkTS在TS的基础上主要扩展了如下能力：基本语法：ArkTS定义了声明式UI描述、自定义组件和动态扩展UI元素的能力，再配合ArkUI开发框架中的系统组件及其相关的事件方法、属性方法等共同构成了UI开发的主体。状态管理：ArkTS提供了多维度的状态管理机制。在UI开发框架中，与UI相关联的数据可以在组件内使用，也可以在不同组件层级间传递，比如父子组件之间、爷孙组件之间，还可以在应用全局范围内传递或跨设备传递。另外，从数据的传递形式来看，可分为只读的单向传递和可变更的双向传递。开发者可以灵活地利用这些能力来实现数据和UI的联动。渲染控制：ArkTS提供了渲染控制的能力。条件渲染可根据应用的不同状态，渲染对应状态下的UI内容。循环渲染可从数据源中迭代获取数据，并在每次迭代过程中创建相应的组件。数据懒加载从数据源中按需迭代数据，并在每次迭代过程中创建相应的组件。未来，ArkTS会结合应用开发/运行的需求持续演进，逐步提供并行和并发能力增强、系统类型增强、分布式开发范式等更多特性。{card-describe title="tips"}TypeScript 的定位是静态类型语言，在写代码阶段就能检查错误，而非运行阶段。类型系统是最好的文档，增加了代码的可读性和可维护性。{/card-describe}二、基本语法（一）定义格式：关键字 变量名:类型 = 值关键字：var、let、constvar myname1:string = "hongtang"//不具备块限制（类似于全局变量） let myname2:string = "hongtang"//对应块级作用域（类似于局部变量） const myname3:string = "hongtang"//表示常量类型：string、boolean、number、anylet mystring:string = "hongtang"//仅能存储字符串 let mybool:boolean = false//仅能存储布尔值 let mynumber:number = 123//仅能存储数字 let myany:any = "hongtang"//可存储任意类型定义单一类型数组方式let mylist1:Array<string> = ["ht0","ht1","ht2"]//用 Array<类型> 表示数组 let mylist2:string[] = ["ht3","ht4","ht5"]//用 类型[] 表示数组定义联合类型let mystrandnum:string | number = "a"//用 | 隔开表示多种类型 let mylist5:any = "hongtang"//可存储任意类型 let mylist3:Array<string | number> = ["ht0",123,"ht1"]//用 | 隔开表示能多种类型的数组 let mylist4:(string | number)[] = ["ht2",456,"ht3"]//用 ()和| 表示能多种类型的数组（二）枚举定义//无值 enum ht1{ "A","B","C" } //有值 enum ht1{ "A" = 1, "B" = 2, "C" = 3 }访问ht1.A ht2["A"]打印console.log(ht1.A)//在ArkTS开发环境下，仅能打印字符串类型 console.log(ht1.A.toString())//或强制转换为字符串类型后打印（三）对象定义//固定类型 let myinf1 = { name:"hongtang", age:18 }//无法再添加属性 //指定类型和可选类型 let myinf2:{name:string,age:number,location?:string} = { name:"hongtang", age:18 }//location?标识location属性可选，无法再添加属性 //指定接口 interface IOht{ name:string, age:number, location?:string, [propName:string]:any//表示可添加任意类型属性属性 } //实例化 let myinf3:IOht = { name:"hongtang", age:"18" }扩展属性并赋值myinf3.country = "China"（四）判断===和==的区别"2" == 2//在TS中，表示只判断值不判断类型，结果为true "1" === 1//在TS中，表示判断类型和值，结果为falseif_else判断let order_type:number = 3 if(order_type===1){ console.log("已付款") }else if(order_type===2){ console.log("已发货") }else{ console.log("已完成") }switc判断let order_type:number = 3 switch (order_type){ case 1: console.log("已付款"); break; case 2: console.log("已发货"); break; case 3: console.log("已完成"); break; default : console.log('默认') }（五）for循环let datalist:string[]= ["华为mate60","华为mate60Pro","华为nova"] for(let i=0;i<datalist.length;i++){ console.log(datalist[i]); }//定义i并规定初始值，满足条件，递增 console.log("-------------------") for(let i in datalist){ console.log(datalist[i]); }//此处i是从0开始增加的 console.log("-------------------") for(let i of datalist){ console.log(i); }//此处i即表示确切的内容而不是键（六）函数定义//普通函数 function test1(){ console.log("test1-普通") } //箭头函数 const test2 = ()=>{ console.log("test2-箭头") } //指定参，返回值 const test3 = (state:number):string=>{ let text:string = "" switch (state){ case 1: text = "已付款" break; case 2: text = "已发货" break; case 3: text = "已完成" break; default : text="默认" } return text }//state:传入参数名称，number:传入参数类型，string:返回参数类型调用test1() test2() test3(2)（七）类//定义类 class person{ public name:string; protected age:number; private country:string;//三种不同修饰词 constructor(name:string,age:number,country:string){ this.name = name; this.age = age; this.country = country; }//构造函数，赋值 //类的成员方法 say():string{ return this.name; } } //实例化 let p = new person("hongtang",18,"China"); console.log(p.name); //继承并添加项，即为person的子类 class student extends person{ schollName :string; constructor(name:string,age:number,country:string,school:string){ super(name,age,country); this.schollName = school; } say():string{ return this.name+"----"+this.age+"--"+this.schollName; } } //实例化 let s = new student("hongtang",18,"China","学校名字"); console.log(s.say());（八）接口interface IContainer{ render() } class Tabbar implements IContainer{ render(){ console.log("选项卡渲染") } } class MySwiper implements IContainer{ render(){ console.log("轮播渲染") } } function init(container:IContainer){ container.render() } init(new MySwiper()) init(new Tabbar())（九）泛型class Cache<T> { // 此处T可用任意一个大写字母表示 // private map:Map<string,T> = new Map() private map = {} setCache(key:string,value:T){ this.map[key] = value } getCache(key:string):T{ return this.map[key] } } let obj = new Cache<string>() obj.setCache("name","kerwin") console.log(obj.getCache("name"))（十）引用{tabs}{tabs-pane label="Index.ets"}import Obj,{test1,test2 as TEST2} from '../01-ts/typescript.ts' //Obj是可以直接随便取的 //{test1}必须和子文档中导出的名称一样，如果要起别名，参考test2 console.log(Obj.name) test1() TEST2() //日志： //... app log: hongtang //... app log: test1 //... app log: test2{/tabs-pane}{tabs-pane label="../01-ts/typescript.ts"}const obj = { name:"hongtang", age:18 } function test1(){ console.log("test1") } function test2(){ console.log("test2") } export default obj//默认导出 export {test1, test2}//按需导出{/tabs-pane}{/tabs}

「鸿蒙入门」0_前情提要 鸿蒙开发工具主要使用的是HUAWEI DevEco Studio（获取工具请单击链接下载，以下简称DevEco Studio），是基于IntelliJ IDEA Community开源版本打造，为运行在HarmonyOS和OpenHarmony系统上的应用和服务（以下简称应用/服务）提供一站式的开发平台。作为一款开发工具，除了具有基本的代码开发、编译构建及调测等功能外，DevEco Studio还具有如下特点：高效智能代码编辑：支持ArkTS、JS、C/C++等语言的代码高亮、代码智能补齐、代码错误检查、代码自动跳转、代码格式化、代码查找等功能，提升代码编写效率。更多详细信息，请参考编辑器使用技巧。低代码可视化开发：丰富的UI界面编辑能力，支持自由拖拽组件和可视化数据绑定，可快速预览效果，所见即所得；同时支持卡片的零代码开发，降低开发门槛和提升界面开发效率。更多详细信息，请参考使用低代码开发应用/服务。多端双向实时预览：支持UI界面代码的双向预览、实时预览、动态预览、组件预览以及多端设备预览，便于快速查看代码运行效果。更多详细信息，请参考使用预览器预览应用/服务界面效果。多端设备模拟仿真：提供HarmonyOS本地模拟器，支持手机等设备的模拟仿真，便捷获取调试环境。更多详细信息，请参考使用模拟器运行应用/服务。{card-describe title="tips"}具体的安装和环境搭建请参考官方开发文档。本系列将全程使用DevEco Studio工具。{/card-describe}