HarmonyOS第一课ArkTS开发语言(TypeScript快速入门)

news2024/12/23 22:27:22

编程语言介绍

ArkTS是HarmonyOS优选的主力应用开发语言。它在TypeScript（简称TS）的基础上，匹配ArkUI框架，扩展了声明式UI、状态管理等相应的能力，让开发者以更简洁、更自然的方式开发跨端应用。要了解什么是ArkTS，我们首先要了解下ArkTS、TypeScript和JavaScript之间的关系：

  • JavaScript是一种属于网络的高级脚本语言，已经被广泛用于Web应用开发，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。
  • TypeScript 是 JavaScript 的一个超集，它扩展了 JavaScript 的语法，通过在JavaScript的基础上添加静态类型定义构建而成，是一个开源的编程语言。
  • ArkTS兼容TypeScript语言，拓展了声明式UI、状态管理、并发任务等能力。

由此可知，TypeScript是JavaScript的超集，ArkTS则是TypeScript的超集，他们的关系如下图所示：

点击放大

在学习ArkTS声明式的相关语法之前，我们首先学习下TypeScript的基础语法。

基础类型

TypeScript支持一些基础的数据类型，如布尔型、数组、字符串等，下文举例几个较为常用的数据类型，我们来了解下他们的基本使用。

布尔值

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

let isDone: boolean = false;

数字

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

let decLiteral: number = 2023;
let binaryLiteral: number = 0b11111100111;
let octalLiteral: number = 0o3747;
let hexLiteral: number = 0x7e7;

字符串

TypeScript里使用 string表示文本数据类型， 可以使用双引号（ "）或单引号（'）表示字符串。

let name: string = "Jacky";
name = "Tom";
name = 'Mick';

数组

TypeScrip有两种方式可以定义数组。 第一种，可以在元素类型后面接上 []，表示由此类型元素组成的一个数组。

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

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

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

元组

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

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

枚举

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

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

Unknown

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

let notSure: unknown = 4;
notSure = 'maybe a string instead';
notSure = false;

Void

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

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

Null 和 Undefined

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

let u: undefined = undefined;
let n: null = null;

联合类型

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

let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
myFavoriteNumber = 7;

条件语句

条件语句用于基于不同的条件来执行不同的动作。TypeScript 条件语句是通过一条或多条语句的执行结果（True 或 False）来决定执行的代码块。

if 语句

TypeScript if 语句由一个布尔表达式后跟一个或多个语句组成。

var num:number = 5
if (num > 0) { 
   console.log('数字是正数') 
}

if…else 语句

一个 if 语句后可跟一个可选的 else 语句，else 语句在布尔表达式为 false 时执行。

var num:number = 12; 
if (num % 2==0) { 
    console.log('偶数'); 
} else {
    console.log('奇数'); 
}

if…else if…else 语句

if…else if…else 语句在执行多个判断条件的时候很有用。

var num:number = 2 
if(num > 0) { 
    console.log(num+' 是正数') 
} else if(num < 0) { 
    console.log(num+' 是负数') 
} else { 
    console.log(num+' 为0') 
}

switch…case 语句

一个 switch 语句允许测试一个变量等于多个值时的情况。每个值称为一个 case，且被测试的变量会对每个 switch case 进行检查。

var grade:string = 'A'; 
switch(grade) { 
    case 'A': { 
        console.log('优'); 
        break; 
    } 
    case 'B': { 
        console.log('良'); 
        break; 
    } 
    case 'C': {
        console.log('及格'); 
        break;    
    } 
    case 'D': { 
        console.log('不及格'); 
        break; 
    }  
    default: { 
        console.log('非法输入'); 
        break;              
    } 
}

函数

函数是一组一起执行一个任务的语句，函数声明要告诉编译器函数的名称、返回类型和参数。TypeScript可以创建有名字的函数和匿名函数，其创建方法如下：

// 有名函数
function add(x, y) {
  return x + y;
}

// 匿名函数
let myAdd = function (x, y) {
  return x + y;
};

为函数定义类型

为了确保输入输出的准确性，我们可以为上面那个函数添加类型：

// 有名函数：给变量设置为number类型
function add(x: number, y: number): number {
  return x + y;
}

// 匿名函数：给变量设置为number类型
let myAdd = function (x: number, y: number): number {
  return x + y;
};

可选参数

在TypeScript里我们可以在参数名旁使用 ?实现可选参数的功能。 比如，我们想让lastName是可选的：

function buildName(firstName: string, lastName?: string) {
    if (lastName)
        return firstName + ' ' + lastName;
    else
        return firstName;
}

let result1 = buildName('Bob');
let result2 = buildName('Bob', 'Adams');

剩余参数

剩余参数会被当做个数不限的可选参数。 可以一个都没有，同样也可以有任意个。 可以使用省略号（ …）进行定义：

function getEmployeeName(firstName: string, ...restOfName: string[]) {
  return firstName + ' ' + restOfName.join(' ');
}

let employeeName = getEmployeeName('Joseph', 'Samuel', 'Lucas', 'MacKinzie');

箭头函数

ES6版本的TypeScript提供了一个箭头函数，它是定义匿名函数的简写语法，用于函数表达式，它省略了function关键字。箭头函数的定义如下，其函数是一个语句块：

( [param1, parma2,…param n] )=> {
    // 代码块
}

其中，括号内是函数的入参，可以有0到多个参数，箭头后是函数的代码块。我们可以将这个箭头函数赋值给一个变量，如下所示：

let arrowFun = ( [param1, parma2,…param n] )=> {
    // 代码块
}

如何要主动调用这个箭头函数，可以按如下方法去调用：

arrowFun(param1, parma2,…param n)

接下来我们看看如何将我们熟悉的函数定义方式转换为箭头函数。我们可以定义一个判断正负数的函数，如下：

function testNumber(num: number) {
  if (num > 0) {
    console.log(num + ' 是正数');
  } else if (num < 0) {
    console.log(num + ' 是负数');
  } else {
    console.log(num + ' 为0');
  }
}

其调用方法如下：

testNumber(1)   //输出日志：1 是正数

如果将这个函数定义为箭头函数，定义如下所示：

let testArrowFun = (num: number) => {
  if (num > 0) {
    console.log(num + ' 是正数');
  } else if (num < 0) {
    console.log(num + ' 是负数');
  } else {
    console.log(num + ' 为0');
  }
}

其调用方法如下：

testArrowFun(-1)   //输出日志：-1 是负数

后面，我们在学习HarmonyOS应用开发时会经常用到箭头函数。例如，给一个按钮添加点击事件，其中onClick事件中的函数就是箭头函数。

Button("Click Now")
  .onClick(() => {
    console.info("Button is click")
  })

类

TypeScript支持基于类的面向对象的编程方式，定义类的关键字为 class，后面紧跟类名。类描述了所创建的对象共同的属性和方法。

类的定义

例如，我们可以声明一个Person类，这个类有3个成员：一个是属性（包含name和age)，一个是构造函数，一个是getPersonInfo方法，其定义如下所示。

class Person {
  private name: string
  private age: number

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  public getPersonInfo(): string {
    return `My name is ${this.name} and age is ${this.age}`;
  }
}

通过上面的Person类，我们可以定义一个人物Jacky并获取他的基本信息，其定义如下：

let person1 = new Person('Jacky', 18);
person1.getPersonInfo();

继承

继承就是子类继承父类的特征和行为，使得子类具有父类相同的行为。TypeScript中允许使用继承来扩展现有的类，对应的关键字为extends。

class Employee extends Person {
  private department: string

  constructor(name: string, age: number, department: string) {
    super(name, age);
    this.department = department;
  }

  public getEmployeeInfo(): string {
    return this.getPersonInfo() + ` and work in ${this.department}`;
  }
}

通过上面的Employee类，我们可以定义一个人物Tom，这里可以获取他的基本信息，也可以获取他的雇主信息，其定义如下：

let person2 = new Employee('Tom', 28, 'HuaWei');
person2.getPersonInfo();
person2.getEmployeeInfo();

在TypeScript中，有public、private、protected修饰符，其功能和具体使用场景大家可以参考TypeScript的相关学习资料，进行拓展学习。

模块

随着应用越来越大，通常要将代码拆分成多个文件，即所谓的模块（module）。模块可以相互加载，并可以使用特殊的指令 export 和 import 来交换功能，从另一个模块调用一个模块的函数。

两个模块之间的关系是通过在文件级别上使用 import 和 export 建立的。模块里面的变量、函数和类等在模块外部是不可见的，除非明确地使用 export 导出它们。类似地，我们必须通过 import 导入其他模块导出的变量、函数、类等。

导出

任何声明（比如变量，函数，类，类型别名或接口）都能够通过添加export关键字来导出，例如我们要把NewsData这个类导出，代码示意如下：

export class NewsData {
  title: string;
  content: string;
  imagesUrl: Array<NewsFile>;
  source: string;

  constructor(title: string, content: string, imagesUrl: Array<NewsFile>, source: string) {
    this.title = title;
    this.content = content;
    this.imagesUrl = imagesUrl;
    this.source = source;
  }
}

导入

模块的导入操作与导出一样简单。 可以使用以下 import形式之一来导入其它模块中的导出内容。

import { NewsData } from '../common/bean/NewsData';

迭代器

当一个对象实现了Symbol.iterator属性时，我们认为它是可迭代的。一些内置的类型如Array，Map，Set，String，Int32Array，Uint32Array等都具有可迭代性。

for…of 语句

for…of会遍历可迭代的对象，调用对象上的Symbol.iterator方法。 下面是在数组上使用for…of的简单例子：

let someArray = [1, "string", false];

for (let entry of someArray) {
    console.log(entry); // 1, "string", false
}

for…of vs. for…in 语句

for…of和for…in均可迭代一个列表，但是用于迭代的值却不同：for…in迭代的是对象的键，而for…of则迭代的是对象的值。

let list = [4, 5, 6];

for (let i in list) {
    console.log(i); // "0", "1", "2",
}

for (let i of list) {
    console.log(i); // "4", "5", "6"
}

后续学习

TypeScript是一个开源的编程语言，本章节只介绍了TypeScript的基础语法知识，更多内容大家可以参考TypeScript的官方教程（https://www.typescriptlang.org/docs/）。大家在学习过程中，如果没有搭建TypeScript的开发环境，也可以直接使用在线Playground平台（https://www.typescriptlang.org/play）进行编码练习。已掌握TypeScript编程基础的学员可以跳过本章节的学习，没有接触过TypeScript的同学可以先补齐相关的语法基础，再进入HarmonyOS的相关开发学习之旅。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1306550.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

解决设备维修管理问题，易点易动来帮忙！

解决设备维修管理问题，易点易动来帮忙！

设备维修管理常常存在一些问题&#xff0c;给企业带来不便和困扰&#xff1a; 1&#xff09;维修信息不及时准确&#xff0c;导致维修延误或错过重要维护时机&#xff1b; 2&#xff09;纸质记录容易丢失或难以管理&#xff0c;使得维修历史不完整&#xff1b; 3&#xff09…
阅读更多...
MISC之LSB

MISC之LSB

LSB隐写 简介 LSB隐写&#xff08;Least Significant Bit Steganography&#xff09;是一种隐写术&#xff0c;它通过将秘密信息嵌入到图像、音频或视频等多媒体文件中的最低有效位中来隐藏信息。在数字图像中&#xff0c;每个像素由红、绿、蓝三个通道的颜色值组成。每个颜色…
阅读更多...
c语言插入排序算法（详解）

c语言插入排序算法（详解）

插入排序是一种简单直观的排序算法&#xff0c;其主要思想是将一个待排序的元素插入到已经排好序的部分的合适位置。 插入排序的原理如下&#xff1a; 将序列分为两部分&#xff1a;已排序部分和未排序部分。初始时&#xff0c;已排序部分只包含第一个元素&#xff0c;未排序…
阅读更多...
Unity 射线检测（Raycast）检测图层（LayerMask）的设置

Unity 射线检测（Raycast）检测图层（LayerMask）的设置

目录 主要内容 拓展&#xff1a; 主要内容 Raycast函数有很多重载(函数的重载根据函数的参数来决定) 这里只涉及这个重载,其余重载可以很方便得在Visual Studio中看源码获取&#xff1b; public static bool Raycast(Vector3 origin, Vector3 direction, out RaycastHit hit…
阅读更多...
成绩统计（oj题）

成绩统计（oj题）

一道考验细节的题 最后是&#xff1f;&#xff1a;运算符用错了 代码如下&#xff1a; #include<stdio.h> #include<string.h> typedef struct Grade{int num;int inv; }Grade; Grade tmp[10]; int n, m, g, interval[10] {0};int main(void) {scanf("%d%d…
阅读更多...
智能优化算法应用：基于鸟群算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用：基于鸟群算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于鸟群算法3D无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于鸟群算法3D无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.鸟群算法4.实验参数设定5.算法结果6.参考文献7.MA…
阅读更多...
Vue3-15-事件处理的基本使用详解

Vue3-15-事件处理的基本使用详解

什么是事件处理 事件处理 &#xff1a; 就是对页面上的事件进行捕获并进行逻辑上的处理。 例如 &#xff1a; 点击了一个按钮&#xff0c;捕获点击事件&#xff0c;并进行响应的逻辑处理。vue3中的事件处理的语法 主要使用到的是 v-on 指令&#xff0c; 这个指令的语法糖&…
阅读更多...
【教程】如何将重要文件进行混淆和加密

【教程】如何将重要文件进行混淆和加密

怎么保护苹果手机移动应用程序ipa中文件安全&#xff1f; ios应用程序存储一些图片&#xff0c;资源&#xff0c;配置信息&#xff0c;甚至敏感数据如用户信息、证书、私钥等。这些数据怎么保护呢&#xff1f;可以使用iOS提供的Keychain来保护敏感数据&#xff0c;也可以使用加…
阅读更多...
机器学习---TF-IDF算法

机器学习---TF-IDF算法

1、TF-IDF TF-IDF(Term Frequency-Inverse Document Frequency, 词频-逆文本频率)。TF指词频&#xff0c;IDF指的是逆文本频率。TF-IDF是一种用于信息检索与数据挖掘的常用加权技术&#xff0c;可以评估一个词在一个文件集或者一个语料库中对某个文件的重要程度。一个词语在一篇…
阅读更多...
创邻科技上榜中国信通院《高质量数字化转型产品及服务全景图》

创邻科技上榜中国信通院《高质量数字化转型产品及服务全景图》

近年来&#xff0c;数字化转型浪潮浩浩荡荡&#xff0c;已成为企业高质量发展的必由之路。 但是企业的数字化转型之路并不简单。一方面&#xff0c;企业对数字化转型仍面临着“战略缺位”“能力难建”“价值难现”等问题&#xff1b;另一方面&#xff0c;市场上众多的数字化转…
阅读更多...
Day58力扣打卡

Day58力扣打卡

打卡记录 下一个更大元素 IV&#xff08;单调栈 x2&#xff09; 链接 class Solution:def secondGreaterElement(self, nums: List[int]) -> List[int]:ans [-1] * len(nums)s []t []for i, x in enumerate(nums):while t and nums[t[-1]] < x:ans[t.pop()] x # t…
阅读更多...
班主任，再也不愁怎么给学生发成绩了

班主任，再也不愁怎么给学生发成绩了

作为班主任&#xff0c;我们时常面临着如何有效地将学生的成绩信息传达给家长的问题。传统的纸质成绩单邮寄方式不仅效率低下&#xff0c;而且容易丢失&#xff0c;难以保证信息的及时性和准确性。现在&#xff0c;有了微信「群发成绩」小程序&#xff0c;班主任们终于可以摆脱…
阅读更多...
ISP去噪（2）_np 噪声模型

ISP去噪（2）_np 噪声模型

#灵感# ISP 中的去噪&#xff0c;都需要依赖一个噪声模型。很多平台上使用采集的raw进行calibration&#xff0c;可以输出这个模型&#xff0c;通常称为 noise profile。 目录 名词解释&#xff1a; 标定方法&#xff1a; 校准出的noise profile: noise profile 作用域&am…
阅读更多...
异常当做业务逻辑处理严重影响性能

异常当做业务逻辑处理严重影响性能

一：背景 在项目应该或多或少的见过有人把异常当做业务逻辑处理的情况(┬＿┬)，比如说判断一个数字是否为整数,就想当然的用try catch包起来，再进行 int.Parse，如果抛异常就说明不是整数，简单粗暴，也不需要写正则或者其他逻辑，再比如一个字符串强制转化为Enum，直接用Enu…
阅读更多...
Linux中的堡垒机搭建以及使用

Linux中的堡垒机搭建以及使用

JumpServer搭建 安装应用包 curl -sSL https://resource.fit2cloud.com/jumpserver/jumpserver/releases/latest/download/quick_start.sh | bash 一路回车即可安装完毕&#xff08;可根据需求更改&#xff09; JumpServer的 配置文件路径 /opt/jumpserver/config/config.tx…
阅读更多...
python request 不走代理proxy

python request 不走代理proxy

遇到问题如&#xff1a; requests.exceptions.ProxyError: HTTPSConnectionPool(host‘quake.360.net’, port443): Max retries exceeded with url: /api/v3/search/quake_service (Caused by ProxyError(‘Cannot connect to proxy.’, OSError 解决如下&#xff1a; 一般…
阅读更多...
分页存储管理

分页存储管理

页框和页面 将内存空间分为一个个大小相等的分区 (比如:每个分区4KB)&#xff0c;每个分区就是一个“页框”(页框页内存块物理块物理页面)。每个页框有一个编号&#xff0c;即“页框号”(页框号页帧号内存块号物理块号物理页号)&#xff0c;页框号从0开始。 为了将各个进程的数…
阅读更多...
基于Java SSM框架实现家用电器销售系统项目【项目源码+论文说明】计算机毕业设计

基于Java SSM框架实现家用电器销售系统项目【项目源码+论文说明】计算机毕业设计

基于java的SSM框架实现家用电器销售系统演示 摘要 家用电器销售网站采用B/S模式&#xff0c;促进了家用电器销售的安全、质量、快捷的发展。传统的管理模式还处于手工处理阶段&#xff0c;管理效率极低&#xff0c;随着用户的不断增多&#xff0c;传统基于手工管理模式已经无法…
阅读更多...
后端返回base64文件前端如何下载

后端返回base64文件前端如何下载

1.后端返回base64格式文件 2.前端代码 <style lang"less" scoped> import "./style/common.less";.table-div-a {color: #409EFF;text-decoration: underline;cursor: pointer; } </style><template><div class"template-con…
阅读更多...
​hashlib --- 安全哈希与消息摘要​

​hashlib --- 安全哈希与消息摘要​

源码&#xff1a; Lib/hashlib.py 本模块针对许多不同的安全哈希和消息摘要算法实现了一个通用接口。 包括了 FIPS 安全哈希算法 SHA1, SHA224, SHA256, SHA384, SHA512, (定义见 the FIPS 180-4 standard), SHA-3 系列 (定义见 the FIPS 202 standard) 以及 RSA 的 MD5 算法 (…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023