当前位置:   article > 正文

ArkTs基础_arkts 数组创建

arkts 数组创建

ArkTs的介绍

        ArkTs语言是基于Ts的扩展,是harmony的主力应用开发语言,匹配了ArkUI框架,扩展了声明式UI、状态管理等,可以实现开发跨端应用。而Ts是Js的超集,扩展了Js的语法。

TS基础

TypeScript的基础类型
类型表示示例
布尔值boolean let isFinished :boolean = false;
数字类型numberlet number :number = 20;
字符串string

let name : string = 'strawberry';

let name :string = "strawberry";

数组number[] 或 Array<number>

let list1 : number[] = [1,2,3];

let list2 : Array<number> = [1,2,3];

元组表示一个已知元素数量和类型的数组,各元素的类型不必相同let x = [string ,number];
枚举enumenum Color{Red,Green,Blue}
unknown未知编程阶段还不清楚类型的变量
void返回值为void同C
null、undefined需要分开定义

 let u : undefined = undefined;

let null :null = null;

联合类型取值可以为多种类型中的一种let myFavoriteNumber :string | number
  myFavoriteNumber = '';
  myFavoriteNumber = 20;

条件语句

    同其他开发语言。

函数

定义

      与kotlin类似,关键字由fun改为function,示例代码如下:

  1. Ts:
  2. function add(x:number ,y :number):number{
  3. return x+y;
  4. }
  5. kotlin:
  6. fun add (x:Int , y:Int) :Int{
  7. return x+y;//kotlin可以不写分号,目前没发现ts可以不需要写分号,后续发现补充
  8. }
可选参数

用?表示,类似kotlin的空判断

剩余参数

可以被当做个数不限的可选参数,类似变长参数,用...表示

箭头函数

ES6版本提供了一个箭头函数,定义匿名函数的简写语法,用于函数表达式,省略了function的关键字。

  1. ([param1,param2,...paramn]) =>{
  2. //语句块
  3. }

用class表示,基于类的面向对象的编程方式。调用类似于java

同样具有继承(extends)

模块(module)

将代码拆分成多个文件,即所谓的模块。模块可以相互加载,并可以使用export和import交换功能,模块间可以相互调用。

模块里的变量、函数和类在模块外部是不可见的,除非明确使用export导出,同理,必须通过import导入其他模块导出的变量、函数、类等。

迭代器

当对象实现了Symbol.iterator属性,表示它可迭代,具有迭代性。

迭代方式:

  • for .. of (循环遍历)遍历的是数组的值
  • for .. in  遍历的是数组的下标(index) 、、0,1,2,3..

网址:华为开发者学堂

ArkTS

声明式UI

装饰器:装饰类、结构、方法和变量,赋予其特殊含义。

@Component:装饰器,表示自定义组件  (疑问:和注解有什么区别?特殊注解?)

@State:表示状态改变,当状态改变时,触发对应的组件刷新

自定义组件:类似自定义控件

  1. @Component
  2. struct 自定义组件名 {
  3. ...
  4. build(){
  5. ...
  6. }
  7. ...
  8. }

@Entry 自定义组件当做页面的默认入口组件,加载页面是首先创建并呈现。一个页面有且只能有一个。 

自定义组件生命周期

被@Component修饰

  1. aboutToAppear() :创建组件后,执行build之前:可以对展示的数据初始化、申请资源等。
  2. aboutToDisappear():自定义组件实例被销毁时调用,可以用于销毁资源。

注:方法私有,在特定时间由系统调用,无法手动通过代码调用。

页面入口组件生命周期:

被@Entry修饰

  1. aboutToAppear():
  2. onPageShow():页面显示
  3. onBackPress():返回back
  4. onPageHide():页面消失 Home、Back等
  5. aboutToDisappear():

UI控制渲染

条件渲染:if...else if ...else

循环渲染:ForEach

状态管理

@State:表示状态改变

@Link: @Link修饰的变量可以喝父组件的@State变量建立双向数据绑定。任何一方所做的修改都会反应给另一方。

另:$创建引用

​​​​​​​网址:文档中心


以下内容为2024年1月30日补充

声明式UI

特征:

  • 声明式描述
  • 状态驱动视图更新

自定义组件

声明:

  1. @Entry //作为页面入口
  2. @Component 
  3. struct 自定义组件名 {
  4.    build(){
  5.       Column(){
  6.         //自定义组件的具体内容
  7.       }
  8.    }
  9. }

@Builder装饰器,来修饰一个函数,快速生成布局内容,从而可以避免重复的UI描述内容

@Link变量不能在组件内部进行初始化

开发注意事项 

不是所有的开发注意事项,刚开始接触,看到需要注意的点,就会记下来,后续会补充追加,用词可能也不准确,确保能看懂即可。

1.DevEco Studio开发过程中支持页面(组件)预览,但,预览的页面(组件)需要被@Entry标记,非@Entry标记的普通组件(@Entry标记的组件为入口页面)需要预览的话需要被@Preview,否则不支持预览;

 代码:

至此,已经可以完成基本的harmony应用页面开发。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/AllinToyou/article/detail/317706
推荐阅读
相关标签
  

闽ICP备14008679号