关于HarmonyOS的API从8到API12，存在不少版本的差异，比如一些ArkTS语法上的差异；一些组件在API9之前不支持的功能，本人在项目开发过程中也是踩了不少坑，现在给大家分享一下心得。
1.语法差异
首先是ArkTS语法上的差异。可以参考官方文档：从TypeScript到ArkTS语言适配规则| 华为开发者联盟 (huawei.com)
- 函数表达式不支持，必须用箭头函数；
- 展开运算符只支持数组；
- 不支持赋值解构；
- var 不支持，必须用 let 或者 const；
- 类型限制更为严格，声明变量后面必须定义类型；
ts
@Entry
@Component
struct ArkTSPage {
build() {
Column({ space: 20 }) {
// 以下的是 不支持(推荐)的特性
Button('1. 不使用Var')
.width('100%')
.onClick(() => {
// 1. var有变量提升，不再建议使用
//
// var str
// AlertDialog.show({ message: str })
// str = '西兰花炒蛋'
// 2. 使用 let替代(推荐写法！！！)
let str = '西兰花炒蛋'
AlertDialog.show({ message: str })
// let str = '西兰花炒蛋'
})
Button('2. 声明变量+类型')
.width('100%')
.onClick(() => {
// api9可以不使用类型推断
// let message = 'itheima'
// next 刚出来必须写，现在可以省略
// 1. 基本类型 直接写
let food: string = '西兰花炒蛋'
let age: number = 20
// 2. 对象 可以结合 class 使用
// class Food{
// name:string
// color:string
//
// constructor(name:string,color:string) {
// this.name = name
// this.color = color
// }
// }
// const f:Food = new Food('西兰花','黄绿色')
// 3. 对象的字面量 结合 class的初始值
class Food {
name: string = ''
color: string = ''
}
const f: Food = {
name: '西兰花',
color: '黄绿色'
}
})
Button('3. for in')
.width('100%')
.onClick(() => {
// 定义Class 并设置默认值
class Food {
name: string = ''
color: string = ''
}
let food: Food = {
name: '西兰花',
color: '黄绿色'
}
// 不支持 for in
// for (const key in food) {
// food[key] // ArkTS中 不推荐
// // food.key // 属性名 叫做key
// }
// 可以通过 Object.keys 结合 forEach 进行遍历
// 获取 所有的key 字符串数组
// const keys: string[] = Object.keys(food)
// // AlertDialog.show({ message : JSON.stringify(keys)})
// keys.forEach((key: string) => {
// AlertDialog.show({ message: key })
// })
Object.keys(food)
.forEach((key: string) => {
AlertDialog.show({ message: key })
})
})
Button('4. 解构赋值')
.width('100%')
.onClick(() => {
class Food {
name: string = ''
color: string = ''
}
let food: Food = {
name: '西兰花',
color: '黄绿色'
}
// 不支持(不推荐)
// const {name,color} = food
// 通过 点语法取值
const name: string = food.name
const color: string = food.color
})
Button('5. 函数表达式')
.width('100%')
.onClick(() => {
// 不支持 函数表达式
// const sayHI:()=>void= function (){
// AlertDialog.show({message:'(づ￣ 3￣)づ'})
// }
// 改写为 箭头函数
// const sayHI: () => void = () => {
// AlertDialog.show({ message: '(づ￣ 3￣)づ' })
// }
const sayHI: () => void = () => AlertDialog.show({ message: '(づ￣ 3￣)づ' })
})
// 以下是部分支持的特性
Button('6. 展开运算符...')
.width('100%')
.onClick(() => {
// 用来合并数组 支持
const numArr1: number[] = [1, 2, 3, 4]
const numArr2: number[] = [4, 5, 6]
// ArkTS中支持，可以使用
const totalArr: number[] = [...numArr1, ...numArr2]
// AlertDialog.show({ message: JSON.stringify(totalArr) })
// 合并对象 不支持
class Vegetable {
name: string = ''
color: string = ''
}
class Food {
name: string
color: string
price: number
constructor(vegetable:Vegetable,price:number) {
this.name =vegetable.name
this.color = vegetable.color
this.price = price
}
}
const vegetable: Vegetable = {
name: '西兰花',
color: '黄绿色'
}
// 不支持用来展开对象
// const food:Food ={
// ...vegetable,
// price:10
// }
// 改写为挨个赋值即可
const food:Food = new Food(vegetable,10)
})
// more
Button('..........更多')
.width('100%')
.onClick(() => {
})
}
.padding(10)
}
}2. 组件用法上的差异
2.1. $$语法：内置组件双向同步
- 当前$$支持基础类型变量，以及@State、@Link和@Prop装饰的变量。
- 当前$$支持的组件：
- / $$绑定的变量变化时，会触发UI的同步刷新。
使用示例
以TextInput方法的text参数为例：
ts
// xxx.ets
@Entry
@Component
struct TextInputExample {
@State text: string = ''
controller: TextInputController = new TextInputController()
build() {
Column({ space: 20 }) {
Text(this.text)
TextInput({ text: $$this.text, placeholder: 'input your word...', controller: this.controller })
.placeholderColor(Color.Grey)
.placeholderFont({ size: 14, weight: 400 })
.caretColor(Color.Blue)
.width(300)
}.width('100%').height('100%').justifyContent(FlexAlign.Center)
}
}3. API使用上的差异
首选项持久化在API10以后提供了同步接口来返回preferences实例，代码写法上更简洁实用。
dataPreferences.getPreferences
getPreferences(context: Context, options: Options): Promise
获取Preferences实例，使用Promise异步回调。
示例：
typescript
import UIAbility from '@ohos.app.ability.UIAbility';
import { BusinessError } from '@ohos.base'
import window from '@ohos.window';
let preferences: dataPreferences.Preferences | null = null;
class EntryAbility extends UIAbility {
onWindowStageCreate(windowStage: window.WindowStage) {
let options: dataPreferences.Options = { name: 'myStore', dataGroupId: 'myId' };
let promise = dataPreferences.getPreferences(this.context, options);
promise.then((object: dataPreferences.Preferences) => {
preferences = object;
console.info("Succeeded in getting preferences.");
}).catch((err: BusinessError) => {
console.error("Failed to get preferences. code =" + err.code + ", message =" + err.message);
})
}
}dataPreferences.getPreferencesSync10+
getPreferencesSync(context: Context, options: Options): Preferences
获取Preferences实例，此为同步接口。
示例：
typescript
import UIAbility from '@ohos.app.ability.UIAbility';
import window from '@ohos.window';
let preferences: dataPreferences.Preferences | null = null;
class EntryAbility extends UIAbility {
onWindowStageCreate(windowStage: window.WindowStage) {
let options: dataPreferences.Options = { name: 'myStore', dataGroupId: 'myId' };
preferences = dataPreferences.getPreferencesSync(this.context, options);
}
}暂时想到这么多，有些在API9之前的API将会被废弃，以后再补充。