【HarmonyOS 4.0 应用开发实战】TypeScript入门之声明、数据类型、函数、类的详讲

简介: 【HarmonyOS 4.0 应用开发实战】TypeScript入门之声明、数据类型、函数、类的详讲



TypeScript入门之声明、数据类型、函数、类的详讲

2.2.2 声明

2.2.2.1 变量声明

2.2.2.2 常量声明

let用于声明变量,而const用于声明常量,两者的区别是变量在赋值后可以修改,而常量在赋值后便不能再修改。

const b:number = 200;

2.2.2.3 类型推断

如果一个变量或常量的声明包含了初始值,TS 便可以根据初始值进行类型推断,此时我们就可以不显式指定其类型,例如

let c = 60;
console.log(typeof c); //number

2.2.3 常用数据类型

2.2.3.1 number

number表示数字,包括整数和浮点数,例如: 100、-33 、2.5、-3.9

let a :number = 100
let b :number = -33
let c :number = 2.5
let d :number = -3.9

2.2.3.2 string

string表示字符串,例如: 你好hello

let a:string = '你好'
let b:string = 'hello'

2.2.3.3 boolean

boolean表示布尔值,可选值为:truefalse

let isOpen:boolean = true
let isDone:boolean = false

2.2.3.4 数组

数组类型定义由两部分组成,元素类型[],例如number[]表示数字数组,string[]表示字符串数组,数组类型的变量可由数组字面量——[item1,item2,item3]进行初始化。

let a: number[] = []
let b: string[] = ['你好', 'hello']

2.2.3.5 对象

TS中,对象object)是一种一系列由属性名称和属性值组成的数据结构,例如姓名:‘张三’, 年龄:10, 性别:‘男’。对象类型的声明需要包含所有属性的名称及类型,例如{name: string, age: number, gender: string},对象类型的变量可以通过对象字面量——{name:'张三', age:10, gender:'男'}进行初始化。

let person: {name:string, age:number, gender:string} = {name:'张三', age:10, gender:'男'};

2.2.4 函数

2.2.4.1 函数声明语法

声明函数的基础语法如下

2.2.4.2 参数详解

特殊语法
● 可选参数
  可选参数通过参数名后的?进行标识,如以下案例中的`gender`?参数。
function getPersonInfo(name: string, age: number, gender?: string): string {
    if (gender === undefined) {
        gender = '未知'
    }
    return `name:${name},age:${age},gender:${gender}`;
}
let p1 = getPersonInfo('zhagnsan', 10, '男')
let p2 = getPersonInfo('lisi', 15);
console.log(p1);
console.log(p2);

注:调用函数时,未传递可选参数,则该参数的值为undefined。

● 默认参数
    可在函数的参数列表为参数指定默认值,如以下案例中的gender: string='未知'参数。
function getPersonInfo(name: string, age: number, gender: string='未知'): string {
    return `name:${name},age:${age},gender:${gender}`;
}
let p1 = getPersonInfo('zhagnsan', 10, '男')
let p2 = getPersonInfo('lisi', 15);
console.log(p1);
console.log(p2);

特殊类型

● 联合类型
   一个函数可能用于处理不同类型的值,这种情况可以使用联合类型,例如以下案例中的message: number | string
function printNumberOrString(message: number | string) {
  console.log(message)
}
printNumberOrString('a')
printNumberOrString(1)
● 任意类型
若函数需要处理任意类型的值,则可以使用any类型,例如以下案例中的message: any
function print(message:any) {
  console.log(message)
}
print('a')
print(1)
print(true)

2.2.4.3 返回值详解

  • 特殊类型
    若函数没有返回值,则可以使用void作为返回值类型,其含义为空。
function test(): void {
    console.log('hello');
}
  • 类型推断
    函数的返回值类型可根据函数内容推断出来,因此可以省略不写。
function test() {
    console.log('hello');
}
function sum(a: number, b: number) {
    return a + b;
}

2.2.4.4 函数声明特殊语法

  • 匿名函数
    匿名函数的语法结构简洁,特别适用于简单且仅需一次性使用的场景。
let numbers: number[] = [1, 2, 3, 4, 5]
numbers.forEach(function (number) {
    console.log(number);
})

注意:匿名函数能够根据上下文推断出参数类型,因此参数类型可以省略。

  • 箭头函数
    匿名函数的语法还可以进一步的简化,只保留参数列表和函数体两个核心部分,两者用=>符号连接。
let numbers: number[] = [1, 2, 3, 4, 5]
numbers.forEach((num) => { console.log(num) })

2.2.5 类(class)

2.2.5.1 概述

类(class)是面向对象编程语言中的一个重要概念。

面向对象编程(Object-Oriented Programming,简称OOP)是一种编程范式,其核心理念在于将程序中的数据与操作数据的方法有机地组织成对象,从而使程序结构更加模块化和易于理解。通过对象之间的协同合作,实现更为复杂的程序功能。

类(class)是对象的蓝图或模板,它定义了对象的属性(数据)和行为(方法)。通过类可以创建多个具有相似结构和行为的对象。例如定义一个 Person类,其对象可以有张三、李四等等。

2.2.5.2 语法说明

  • 类的定义
    定义类的语法如下图所示

  • 代码如下:
class Person {
    id: number;
    name: string;
    age: number = 18;
    constructor(id: number, name: string) {
        this.id = id;
        this.name = name;
    }
    introduce(): string {
        return `hello,I am ${this.name},and I am ${this.age} years old`
    }
}
  • 对象创建
  • 语法
    创建对象的关键字为new,具体语法如下
let person = new Person(1,'zhangsan');

● 对象属性的访问

console.log(person.name); //读
person.name = 'lisi'; //写
console.log(person.name);

对象方法的调用

对象创建后,便可通过对象调用类中声明的方法,如下

let intro = person.introduce();
console.log(intro);

静态成员

Typescript 中的类中可以包含静态成员(静态属性和静态方法),静态成员隶属于类本身,而不属于某个对象实例。静态成员通用用于定义一些常量,或者工具方法。

● 声明静态成员

定义静态成员需要使用static关键字。

class Constants{
    static count:number=1;
}
class Utils{
    static toLowerCase(str:string){
        return str.toLowerCase();
    }
}
console.log(Constants.count);
console.log(Utils.toLowerCase('Hello World'));
● 使用静态成员

静态成员无需通过对象实例访问,直接通过类本身访问即可。

console.log(Constants.count);
console.log(Utils.toLowerCase('Hello World'));

2.2.5.3 继承

继承是面向对象编程中的重要机制,允许一个类(子类或派生类)继承另一个类(父类或基类)的属性和方法。子类可以直接使用父类的特性,并根据需要添加新的特性或覆盖现有的特性。这种机制赋予面向对象程序良好的扩展性。

下面通过一个例子演示继承的特性

class Student extends Person {
    classNumber: string;
    constructor(id: number, name: string, classNumber: string) {
        super(id, name);
        this.classNumber = classNumber;
    }
    introduce(): string {
        return super.introduce()+`, and I am a student`;
    }
}
let student = new Student(1,'xiaoming','三年二班');
console.log(student.introduce());

注意:

  • 类的继承需要使用关键字extends
  • 子类构造器中需使用super()调用父类构造器对继承自父类的属性进行初始化。
  • 在子类中可以使用this关键字访问继承自父类的属性和方法。
  • 在子类中可以使用super关键字访问父类定义的方法。

2.2.5.4 访问修饰符

访问修饰符(Access Modifiers)用于控制类成员(属性、方法等)的可访问性。TypeScript提供了三种访问修饰符,分别是privateprotectedpublic

class Person {
    private id: number;
    protected name: string;
    public age: number;
    constructor(id: number, name: string, age: number) {
        this.id = id;
        this.name = name;
        this.age = age;
    }
}
class Student extends Person {
    
}

说明:

private 修饰的属性或方法是私有的,只能在声明它的类中的被访问。

protected 修饰的属性或方法是受保护的,只能在声明它的类和其子类中被访问。

public 修饰的属性或方法是公有的,可以在任何地方被访问到,默认所有的属性和方法都是 public 的。


第三期完结,等待第四弹…

关注博主,收藏专栏持续更新…



欢迎添加微信,加入我的核心小队,请备注来意

👇👇👇👇👇👇👇👇👇👇👇👇👇👇👇

目录
相关文章
|
1月前
|
JavaScript 前端开发
【TypeScript入门】TypeScript入门篇——数据类型
我们人类可以很容易的分清数字与字符的区别,但是计算机并不能呀,计算机虽然很强大,但从某种角度上看又很傻,除非你明确的告诉它,1是数字,“汉”是文字,否则它是分不清1和‘汉’的区别的,因此,在每个编程语言里都会有一个叫数据类型的东东,其实就是对常用的各种数据类型进行了明确的划分,你想让计算机进行数值运算,你就传数字给它,你想让他处理文字,就传字符串类型给他。
17 3
|
4天前
|
存储 JavaScript 前端开发
TypeScript基本数据类型详解
【4月更文挑战第23天】TypeScript基础知识概览:包括Boolean、Number、String、Array、Tuple、Enum、Any、Void、Null和Undefined以及Never类型。了解这些数据类型能提升代码质量和可维护性。示例代码展示了各种类型的用法,如定义布尔变量、数字转换、字符串操作、数组和元组声明、枚举创建、任意类型使用,以及空值和Never类型的场景。掌握这些将有助于更好地使用TypeScript进行开发。
|
11天前
|
JavaScript
vite+typescript从入门到实战(二)
vite+typescript从入门到实战
38 0
|
17天前
|
JavaScript 前端开发
TypeScript极速入门笔记1
TypeScript极速入门笔记1
29 4
|
2月前
|
JavaScript API 开发者
【HarmonyOS 4.0 应用开发实战】ArkTS 快速入门
【HarmonyOS 4.0 应用开发实战】ArkTS 快速入门
254 0
|
2月前
|
存储 JavaScript 前端开发
【HarmonyOS 4.0 应用开发实战】TypeScript入门之元组详讲
【HarmonyOS 4.0 应用开发实战】TypeScript入门之元组详讲
40 0
|
2月前
|
JavaScript 前端开发
【HarmonyOS 4.0 应用开发实战】TypeScript入门之模块化详讲
【HarmonyOS 4.0 应用开发实战】TypeScript入门之模块化详讲
33 0
|
JavaScript Java API
【鸿蒙 HarmonyOS】创建 Java 语言 HarmonyOS 手机应用 ( 首次进入 DevEco Studio 配置环境 | 创建 Java 手机工程 | 鸿蒙工程代码目录简介 )(二)
【鸿蒙 HarmonyOS】创建 Java 语言 HarmonyOS 手机应用 ( 首次进入 DevEco Studio 配置环境 | 创建 Java 手机工程 | 鸿蒙工程代码目录简介 )(二)
333 0
【鸿蒙 HarmonyOS】创建 Java 语言 HarmonyOS 手机应用 ( 首次进入 DevEco Studio 配置环境 | 创建 Java 手机工程 | 鸿蒙工程代码目录简介 )(二)
|
8月前
|
IDE JavaScript API
HarmonyOS开发第一步,熟知开发工具DevEco Studio
本文主要以常见的功能点作为概述希望可以帮助到学习HarmonyOS的开发者。
215 0
|
3月前
|
数据管理 API 调度
【华为鸿蒙系统学习】- HarmonyOS4.0开发|自学篇
【华为鸿蒙系统学习】- HarmonyOS4.0开发|自学篇
206 0