六虎

TypeScript基础（一）基本类型与类型运算

作者：

小综哥

在

引言

TypeScript是一种开源的编程言语，它是JavaScript的超集，意味着所有的JavaScript代码都能够在TypeScript中运转。TypeScript添加了静态类型查看和其他一些新特性，以进步代码的可读性、可维护性和可扩展性。

基本类型

  • number：数字
  • string：字符串
  • boolean：布尔
  • 数组
  • object: 目标
  • null 和 undefined

null和undefined是所有其他类型的子类型，它们能够赋值给其他类型

经过添加strictNullChecks:true，能够获得更严厉的空类型查看，null和undefined只能赋值给本身。

1. 数字类型（number）

let age: number = 25;

2. 字符串类型（string）

let name: string = "John";

3. 布尔类型（boolean）

let isDone: boolean = false;

4. 数组类型（array）

let numbers: number[] = [1, 2, 3, 4, 5];
let fruits: Array<string> = ["apple", "banana", "orange"];

5. 目标（object）

function printValues(obj: object) {
  const values = Object.values(obj)
  values.forEach((v) => console.log(v))
}
printValues({
  name: 'afd',
  age: 33
})

6. null和undefined

let nullValue: null = null;
let undefinedValue: undefined = undefined;

其他常用类型

  • void类型：一般用于束缚函数的回来值，表明该函数没有任何回来
function sayHello(): void {
 console.log("Hello!");
}
  • never类型：一般用于束缚函数的回来值，表明该函数永久不可能完毕
function throwError(message: string): never {
 throw new Error(message);
}
function infiniteLoop(): never {
  while (true) {
    // do something...
  }
}
  • 字面量类型：运用一个值进行束缚。它能够用于限制变量的取值范围，只允许特定的字面量值赋给变量
let arr: [] // arr永久只能取值为一个空数组
let gender = '男' | '女'
  • 元祖类型（Tuple）: 一个固定长度的数组，并且数组中每一项的类型确认
let person: [string, number] = ["John", 25];
  • any类型: any类型能够绕过类型查看，因而，any类型的数据能够赋值给恣意类型
let data: any = "Hello";
data = 123;

类型运算

类型运算符在TypeScript中用于对类型进行操作和组合。以下是对常见的类型运算符进行介绍：

1. 联合类型（Union Types）

运用|运算符将多个类型组合成一个联合类型。表明变量可所以多个类型中的恣意一个。例如：

let age: number | string;
age = 25; // 合法
age = "25"; // 合法

2. 交叉类型（Intersection Types）

运用&运算符将多个类型组合成一个交叉类型。表明变量具有多个类型的特点和办法。例如：

interface A {
 name: string;
}
interface B {
 age: number;
}
type C = A & B;
let person: C = {
 name: "John",
 age: 30
};

3. 可选特点（Optional Properties）

运用?运算符将特点标记为可选的。表明该特点能够存在，也能够不存在。例如：

interface Person {
 name: string;
 age?: number;
}
let person1: Person = {
 name: "John"
};
let person2: Person = {
 name: "Jane",
 age: 25
};

4. 泛型束缚（Generic Constraints）

运用extends关键字对泛型进行束缚，限制泛型参数有必要满足某些条件。例如：

interface Lengthwise {
 length: number;
}
function logLength<T extends Lengthwise>(arg: T): void {
 console.log(arg.length);
}
logLength("Hello"); // 输出 5
logLength([1, 2, 3]); // 输出 3

在这个示例中，咱们运用 extends 关键字束缚泛型参数 T 有必要满足 Lengthwise 接口的要求，即具有 length 特点。经过泛型束缚，咱们能够在函数内部运用泛型参数的特定特点或办法。 这些类型运算符能够协助开发者更灵敏地操作和组合类型，供给了更强壮的类型体系支持。经过合理地运用这些运算符，能够进步代码的可读性和可维护性，并增强类型安全性。

类型别号

类型别号（Type Aliases）是TypeScript中的一种特性，它允许为已有的类型界说一个别号，以进步代码的可读性和可维护性。经过类型别号，能够给杂乱或重复出现的类型界说一个简练的名称。

以下是一些运用类型别号的示例：

1. 基本类型别号

type ID = number;
let userId: ID = 123;

在这个示例中，咱们运用type关键字为number类型界说了一个别号ID，然后将其用于声明变量userId。

2. 联合类型别号

type Status = "success" | "failure";
let result: Status = "success";

在这个示例中，咱们运用type关键字为字符串字面量类型界说了一个联合类型别号Status，它只允许取值为”success”或”failure”。然后将其用于声明变量result。

3. 杂乱目标类型别号

type Point = {
  x: number;
  y: number;
};
let p: Point = { x: 10, y: 20 };

在这个示例中，咱们运用type关键字为目标类型界说了一个别号Point，它包含了两个特点x和y。然后将其用于声明变量p。

经过运用类型别号，咱们能够将杂乱的类型界说简化为一个易于理解和运用的名称。

类型束缚

在TypeScript中，函数能够经过参数类型、回来值类型和函数重载等方法进行束缚。以下是函数的相关束缚和函数重载的示例

1. 参数类型、回来值类型束缚

function multiply(a: number, b: number): number {
 return a * b;
}
let result = multiply(2, 3); // 回来 6

在这个示例中，函数multiply承受两个参数，都是number类型，并且回来值也是number类型。经过回来值类型的束缚，咱们能够保证函数回来的结果符合预期的数据类型。

2.函数重载

function getValue(value: string): string;
function getValue(value: number): number;
function getValue(value: string | number): string | number {
  if (typeof value === "string") {
    return "Hello, " + value;
  } else if (typeof value === "number") {
    return value * 2;
  }
  throw new Error("value不是string或number类型");
}
let result1 = getValue("John"); // 回来 "Hello, John"
let result2 = getValue(5); // 回来 10

在这个示例中，咱们界说了一个名为getValue的函数，并运用多个重载声明来界说不同参数类型对应的回来值类型。在函数体内部，咱们根据参数的类型进行不同的处理。经过函数重载，咱们能够根据不同的参数类型来调用相应的函数实现。

经过参数类型束缚、回来值类型束缚和函数重载等方法，咱们能够在TypeScript中对函数进行更精确的束缚和界说，以进步代码的可读性、可维护性和可靠性。

总结

经过了解这些基本类型和类型运算，开发者能够更好地界说变量、函数参数和回来值的数据类型，并在编码过程中捕获潜在的错误。这有助于进步代码质量、减少调试时刻，并增强代码的可读性、可维护性和可靠性。

更多文章