当前位置:   article > 正文

ArkTs变量类型、数据类型基础语法_arkts 全局变量

arkts 全局变量

可以参考官网学习路径学习HarmonyOS第一课|应用开发视频教程学习|HarmonyOS应用开发官网

 ArkTS是华为自研的开发语言。它在TypeScript(简称TS)的基础上,匹配ArkUI框架,扩展了声明式UI、状态管理等相应的能力,让开发者以更简洁、更自然的方式开发跨端应用。所以学习Arkts之前需要掌握ts,本篇文章主要学习ts语法

关于js和ts基本语法学习参考地址

js:JavaScript 教程 | 菜鸟教程 (runoob.com)

ts:TypeScript 教程 | 菜鸟教程 (runoob.com)

一、变量声明

ts是基于js的 ,基本语法相似,但是ts在js基础上加入了静态类型检查功能,因此每一个变量都有固定的数据类型,语法格式如下

  1. //声明变量并复制
  2. let name = 20
  3. //声明变量并限制类型
  4. let name2: string = "20"
  5. //声明变量 未赋值 用的时候赋值
  6. let age: number
  7. age = 18

1、变量命名要求

  • 变量名称可以包含数字和字母。

  • 变量名不能以数字开头。

  • 除了下划线 _ 和美元 $ 符号外,不能包含其他特殊字符,包括空格。

  • 不能使用关键字和保留字(已经定义了特殊含义的单词)

  • 见名知意

2、变量数据类型

TypeScript支持一些基础的数据类型,如布尔型、数组、字符串等

数字

TypeScript里的所有数字都是浮点数,这些浮点数的类型是 number。除了支持十进制,还支持二进制、八进制、十六进制。

  1. // 数值类型
  2. let num1: number = 18 //十进制
  3. let num2: number = 0b10011 //ob 二进制
  4. let num3: number = 0o1234567 // 0o 八进制
  5. let num4: number = 0x123abcdef //0x 十六进制

字符串

TypeScript里使用 string表示文本数据类型, 可以使用双引号( ")或单引号(')表示字符串或者反引号(`)。

反引号中可以配合${}解析变量

  1. // 字符串类型
  2. let str1: string = 'HarmonyOS4.0'
  3. let str2: string = "ArkTS"
  4. let str3: string = `我年${num1}岁了` //tab上方飘号键盘...
  5. 字符串拼接可以直接使用 +

布尔值

TypeScript中可以使用boolean来表示这个变量是布尔值,可以赋值为true或者false

  1. // 布尔类型 true false
  2. let stateOn: boolean = true
  3. let stateOff: boolean = false

ts中空字符串、数字0、null、undefined都被认为false,其他都是true ,利用这个就可以对某些逻辑判断

  1. if(num))
  2. //num非空 可以执行的逻辑
  3. }

联合类型

联合类型(Union Types)表示取值可以为多种类型中的一种。

如果当下还没想好用哪个类型...

  1. let meiXiangHao: string | number |boolean
  2. meiXiangHao = 'seven'
  3. meiXiangHao = 7
  4. meiXiangHao = true

任意类型

  1. //any:不确定类型 可以是任意类型
  2. let a:any = 'hello'
  3. a=20

对象类型

  1. //object:对象
  2. let o = {name:'zs',age:12}
  3. console.log(o.name)
  4. console.log(o['name'])

数组

TypeScrip有两种方式可以定义数组。

第一种方式是使用数组泛型,Array<元素类型>。

  1. // 数组
  2. let course1: Array<string> = ['入门',"基础语法",`组件`]

第二种,可以在元素类型后面接上 [],表示由此类型元素组成的一个数组。

let course2: string[] = ['动画',"网络",`存储`]

枚举

enum类型是对JavaScript标准数据类型的一个补充,使用枚举类型可以为一组数值赋予友好的名字

  1. enum Color {Red, Green, Blue};
  2. let c: Color = Color.Green;

元组

元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。 比如,你可以定义一对值分别为 stringnumber类型的元组。

  1. let x: [string, number];
  2. x = ['hello', 10]; // OK
  3. x = [10, 'hello']; // Error

Unknown

有时候,我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。那么我们可以使用unknown类型来标记这些变量。(同any

  1. let notSure: unknown = 4;
  2. notSure = 'maybe a string instead';
  3. notSure = false;

Void

当一个函数没有返回值时,你通常会见到其返回值类型是 void。

  1. function test(): void {
  2. console.log('This is function is void');
  3. }

Null 和 Undefined

TypeScript里,undefined和null两者各自有自己的类型分别叫做undefined和null。 

  1. let u: undefined = undefined;
  2. let n: null = null;

二、条件控制

ts也是支持if-else和switch的条件控制

1、if-esle使用

  1. let num:number = 18
  2. //注:这里如果使用==首先会判断两边数据类型是否一致, 不一致会先转,所以 推荐使用===
  3. if(num % 2 === 0){
  4. console.log("偶数")
  5. }else {
  6. console.log("奇数")
  7. }

2、switch使用

三、循环迭代

ts中是支持for和while循环的、并且为一些内置类型如Array提供了快捷迭代语法,如下

 

四、函数

ts中使用function关键字声明函数,且支持可选参数、默认参数、箭头函数等特殊语法

五、类和接口

 ts具备面向对象的基本语法、例如interface、class、enum等,也具备封装、继承、多态等面向对象基本特征

六、模块开发

ts中可以把通用的功能抽取出来作为一个单独的ts文件中、每个文件就是一个模块,模块之间相互加载提高代码复用性 ,如下可以导出类、也可以导出方法

 七、Arkts入门体验

数据类型应用

  1. let message:string = "hello word"
  2. let msgArray:string[] = ['a','b']
  3. @Entry
  4. @Component
  5. struct Index {
  6. @State message: string = 'Hello World'
  7. build() {
  8. Row() {
  9. Column() {
  10. //直接组件中可以使用定义好的变量
  11. Text(message)
  12. .fontSize(50)
  13. .fontWeight(FontWeight.Bold)
  14. }
  15. .width('100%')
  16. .onClick(()=>{
  17. console.log(msgArray[0])
  18. })
  19. }
  20. .height('100%')
  21. }
  22. }

组件内部声明变量

声明是在ets中顶部声明的变量,直接在组件使用,还可以在组件内部直接声明变量

  1. @Entry
  2. @Component
  3. struct Index {
  4. message: string = 'Hello World'
  5. build() {
  6. Row() {
  7. Column() {
  8. //使用this表示找当前组件内的变量 不用this表示在全局中查找
  9. Text(this.message)
  10. .fontSize(50)
  11. .fontWeight(FontWeight.Bold)
  12. }
  13. .width('100%')
  14. .onClick(()=>{
  15. console.log(this.message.toUpperCase())
  16. })
  17. }
  18. .height('100%')
  19. }
  20. }

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

闽ICP备14008679号