🙋 一日之际在于晨
⭐本期内容：TypeScript基础语法详解
🏆系列专栏：鸿蒙HarmonyOS4+NEXT：探索未来智能生态新纪元
文章目录
- 前言
- 变量与类型
- 函数
- 类与接口
- 类（Class）
- 接口（Interface）
- 函数与接口的使用
- 对象的创建与函数的使用
- 泛型
- 总结
前言
TypeScript是一种由微软开发的开源编程语言，它是JavaScript的一个超集，添加了静态类型、类、接口和泛型等特性。这些特性使得TypeScript在大型项目中具有更好的可维护性和可扩展性。本文将对TypeScript的基础语法进行详细讲解，帮助读者快速入门。
变量与类型
TypeScript的核心特性之一就是静态类型系统。这意味着在声明变量时，我们可以为其指定一个类型，这样TypeScript编译器就可以在编译时检查类型错误。
例如：let msg:string=‘hello world’
其中：let为声明变量的关键字，const则代表常量， msg为变量名，是自定义的 string是变量的数据类型
常见的类型有：
string：字符串，可以用单引号或者双引号
let greeting: string = "Hello, World!";
let quote: string = 'To be or not to be, that is the question.';
number：数值、整数、浮点数都可以
let age: number = 30;
let price: number = 19.99;
any：不确定类型，可以是任意类型
let notSure: any = 4;
notSure = "maybe a string instead";
notSure = false;
- union：联合类型，可以是多个指定类型中的一种
let greet: string | number;
greet = "Hello"; // OK
greet = 42; // OK
// greet = true; // Error, boolean is not string or number
Object：对象（注意：在TypeScript中，使用 {} 来表示一个空对象类型，而 Object 实际上指向的是非原始类型）
let person: object = {
name: "Alice",
age: 25
};
Array：数组、元素可以是任意其他类型
let numbers: number[] = [1, 2, 3, 4, 5];
let strings: string[] = ["red", "green", "blue"];
let mixed: (number | string)[] = [1, "two", 3, "four"];
注意，对于 object 类型，实际上在TypeScript中，使用 {} 来定义一个空对象类型可能更加精确，因为它不会接受原始值（如 string、number 等）。而 Object 类型在TypeScript中是一个特殊的类型，它是所有类型的超类型，包括原始类型。因此，使用 Object 类型作为变量类型时，可以为其分配任何类型的值。
在定义数组时，我们通常使用类型后跟方括号的语法，例如 number[] 表示数字数组。如果需要数组中的元素可以是多种类型，可以使用联合类型，例如 (number | string)[] 表示数组中的元素可以是数字或字符串。
函数
在TypeScript中，我们可以为函数参数和返回值指定类型。这有助于我们在编写函数时明确函数的输入和输出，从而提高代码的可读性和可维护性。
如下，我们定义了一个名为greeter的函数，它接受一个string类型的参数person，并返回一个string类型的结果。然后，我们调用这个函数并传入一个字符串变量user作为参数。
注意：在TypeScript中，空字符串、数字0、null、undefined都被认为是false，其它值则为true。
function greeter(person: string): string {
return "Hello, " + person;
}
let user = "Jane";
console.log(greeter(user));
类与接口
在 TypeScript 中，类和接口是面向对象编程的两个核心概念。类（Class）是一种用户自定义的数据类型，它包含属性和方法，可以用来创建对象。接口（Interface）定义了一个对象的结构，它规定了一个对象应该有哪些属性和方法，但不提供具体的实现。
类（Class）
在这个 Animal 类中：
name 是一个属性，用来存储动物的名字。
constructor 是类的构造函数，用于创建类的实例，并初始化 name 属性。
move 是一个方法，用于描述动物移动的行为。注意，move 方法有一个默认参数 distanceInMeters，其默认值为 0。
class Animal {
name: string; // 类的属性
constructor(theName: string) { // 类的构造函数
this.name = theName; // 在构造函数中初始化属性
}
move(distanceInMeters: number = 0) { // 类的方法
console.log(`${this.name} moved ${distanceInMeters}m.`);
}
}
接口（Interface）
Person 接口定义了一个对象应该具有 firstName 和 lastName 两个属性，并且这两个属性都是字符串类型。
interface Person {
firstName: string; // 接口的属性
lastName: string; // 接口的属性
}
函数与接口的使用
greeter 函数接受一个参数 person，该参数的类型是 Person 接口。这意味着任何传递给 greeter 函数的对象都必须具有 firstName 和 lastName 属性。
function greeter(person: Person) { // 函数接受一个符合Person接口的对象
return "Hello, " + person.firstName + " " + person.lastName; // 使用接口的属性
}
对象的创建与函数的使用
这里创建了一个对象 user，它符合 Person 接口的规范（即具有 firstName 和 lastName 属性）。然后，我们将 user 对象传递给 greeter 函数，并打印返回的问候字符串。
let user = { firstName: "Jane", lastName: "User" }; // 创建一个符合Person接口的对象
console.log(greeter(user)); // 调用greeter函数并打印结果
泛型
在 TypeScript 中，泛型（Generics）是一种创建可重用组件的方式，这些组件可以处理多种数据类型，而不是单一的数据类型。泛型允许我们定义函数、接口或类，其中的类型参数可以在使用这些组件时指定。这使得代码更加灵活和可维护，因为我们可以编写一次代码，然后在多种数据类型上重复使用。
如下例子：identity 函数是一个泛型函数，它接受一个类型为 T 的参数，并返回相同类型的值。这里的 T 是一个类型参数，它代表了在函数被调用时可以指定的任意类型。
让我们详细分析一下这个代码：
function identity<T>(arg: T): T {
return arg;
}
在上面的代码中：
< T>：定义了类型参数 T。这告诉 TypeScript，我们打算在函数中使用一个或多个类型作为参数。
arg: T：函数参数 arg 的类型被指定为 T，意味着它可以是任何类型。
return arg;：函数返回与参数相同的值，其类型也是 T。
接着，创建了一个 myIdentity 变量，并将 identity 函数赋值给它。这里使用了另一种语法来指定泛型类型参数。
let myIdentity: <T>(arg: T) => T = identity;
这里，myIdentity 的类型被定义为接受一个类型为 T 的参数并返回相同类型的函数。它实际上是对 identity 函数的一个引用，因此我们可以通过 myIdentity 来调用 identity 函数。
最后使用 myIdentity 函数来处理不同类型的值：
console.log(myIdentity<string>("hello")); // 输出 "hello"
console.log(myIdentity<number>(42)); // 输出 42
myIdentity< string>(“hello”)：在这里，显式地指定了 T 为 string 类型，并传递了一个字符串 “hello” 作为参数。函数返回这个字符串，并输出到控制台。
myIdentity< number>(42)：类似地，指定了 T 为 number 类型，并传递了一个数字 42。函数返回这个数字，并输出到控制台。
总结
今日之学习篇章已然落笔，愿诸君有所收获。🤩
倘若您对此深感兴趣，不妨关注此专栏，新知将持续涌现，与您共舞思维的华章。😎
期待下次再会，愿我们于知识的海洋中，再度相聚，共赏智慧之花绽放。👍
