【Harmony OS 4.0】TypeScript 快速入门

1. 基本类型

ts 复制代码
// 1. boolean 类型
let isOff = true
let isOn = false

// 2. 数字类型
let a: number = 2

// 3. 字符串类型
let aStr:string = "hello"

// 4. 俩种数组类型
let arr1:number[] = [1, 3, 5]
let arr2: Array<string> = ["hello", "world"]

// 4.1 回顾splice用法,改变原数组,返回修改后的数组
let arr3 = [1, 3, 5, 7]
arr3.splice(2, 0, 3) // 把值3添加到下标2的地方
console.log(arr3) // [1, 3, 3, 5, 7]
arr3.splice(4, 1) // 删除下标4的值
console.log(arr3) // [1, 3, 3, 5]

// 5. 定义一个元组类型  ==>  允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。
let arr4: [string, number]
arr4 = ['hello', 100]
arr4 = [100, 'hello'] // error demo
arr4 = ['hello', 100, 200] // error demo

// 6. 定义枚举 enum  ==>  是对javascript标准数据类型的一个补充,可以为一组数值赋予友好的名字。
enum Color { red, green, blue }
let c: Color = Color.green

// 7. 定义未知类型 any/Unknown  ==>  不清楚类型的变量,不希望类型检查器对这些值进行检查,直接通过编译阶段的检查。
let noSure: unknown/any
noSure = 4 // 这里4可以是任意值

// 8. viod  ==>  函数没有返回值
function myfunc(): void {
	// 这里不能有return
}

// 9. Null  ==> 空值,没有给它分配内存,内存中没有变量;
//    undefined  ==> 未定义的变量,有这个变量,但是没有定义

// 10. 联合类型
let a: string | number
a = 'hello'
a = 100

2. 条件语句

ts 复制代码
// 1. if
// 2. if...else 
// 3. if...else if...else ...else
// 4. switch...case,用来做多条件的等于判断
let gender: string = 'mail'
switch (gender) {
	case 'mail': {
		console.log('男')
		break; // 满足条件就终止判断
	}
	case 'femail': {
		console.log('女')
		break;
	}
	default: { // 上面所有case条件都不满足,就会进入default
		console.log('不能确定性别')
		break;
	}
}

3. 循环语句

ts 复制代码
// 1. 
let i: numebr;
for(i = 1;i <= 10;i++) {
	console.log(i)
}

// 2. 只能针对集合或者是列表
let j: any
// let j: unkonwn
let nums: Array<number> = [12, 23, 56, 32]
for (j in nums) {
	console.log(nums[j])
}

4. 函数

ts 复制代码
// 1. 有名函数
function add(x: number, y: number): void{}
add(10, 20)

// 2. 匿名函数
let add_Func = function(x: number, y: number): number{
	return x + y
}
add_Func(10, 20)

// 3. 可选参数的函数
function fn(x: number, name?: string) :void {}
fn(10)

// 4. 剩余参数 ==> 个数不限的可选参数
function fn(x: number, ...other: Array<any>) :void {}
fn(10, 'hello', 30)

// 5. 箭头函数  ==>  定义匿名函数的简写语法
let fn = (x: number, y: number) => {}

5. 类对象

  1. public 公共属性
  2. private 私有属性,只能在类里面用,类对象外无法访问到属性,因此别人在类外面不能随意改动。
    在 ArkTs 中,private 必须本地初始化。
  3. protected 在一个包里面可以用
ts 复制代码
// 1. 定义一个Person类
class Person {
	// 私有属性
	private name: string
	private age: number
	// 定义构造函数
	constructor(name: string, age: number){
		this.name = name
		this.age = age
	}
	// 公共成员函数
	public getPersonInfo() :string {
		return 	`我的名字是${this.name},年龄是${this.age}`
	}
}
let p = new Person('张三', 18)
p.getPersonInfo()

// 2. 继承 extends
// 定义一个Employee类继承Person
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() + `,我的工作部门是${this.department}`
	}
}
let emp = new Employee('王五', 26, '行政部')
emp.getEmployeeInfo()
emp.getPersonInfo()

6. 可迭代对象

  1. 当一个对象实现了 Symbol.iterator 属性时,它是可迭代的。(可以通过for...of循环遍历的对象)。
    一些内置的类型如 Array, Map, Set, String, Int32Array, Uint32Array 等都具有可迭代性。
  2. 迭代器都是可迭代对象
    可迭代对象是迭代器的一个子集
ts 复制代码
// 1. for..of 语句,针对可迭代对象才能使用,i 代表其中元素,不指下标。
let str: string = 'sdfs'
for(let i of str) {
	console.log(i) // s d f s
}

// 2. map类型,每个元素都是由俩个组成:key,value
let map1 = new Map<string, number>()
map1.set('a', 111)
map1.set('b', 222)
map1.set('c', 333)
for(let j of map1) {
	console.log(j) // ['a', 111] ['b', 222] ['c', 333]
	console.log(j[1]) // 111 222 333
}

7. 模块

前端模块化,在 ArkTs中,常用 ES6 模块化。

相关推荐
一條狗1 天前
隨筆 20241224 ts寫入excel表
开发语言·前端·typescript
轻口味2 天前
配置TypeScript:tsconfig.json详解
ubuntu·typescript·json
小林rr3 天前
前端TypeScript学习day03-TS高级类型
前端·学习·typescript
web150850966413 天前
前端TypeScript学习day01-TS介绍与TS部分常用类型
前端·学习·typescript
前端熊猫3 天前
省略内容在句子中间
前端·javascript·typescript
禁止摆烂_才浅4 天前
React全家桶 -【高阶函数/高阶组件/钩子】-【forwardRef、mome、useImperativeHandle、useLayoutEffect】
react.js·typescript
TSFullStack4 天前
TypeScript - 控制结构
typescript
高山我梦口香糖4 天前
[react] 优雅解决typescript动态获取redux仓库的类型问题
前端·react.js·typescript
乐闻x4 天前
如何使用 TypeScript 和 Jest 编写高质量单元测试
javascript·typescript·单元测试·jest
Web阿成4 天前
1.学习TypeScript 类型
javascript·typescript