dreaife的休憩小栈

1. 基础类型#

TypeScript 支持以下常用的基础类型：

• number：数字类型，包括整数和浮点数。

  1
  let age: number = 30

• string：字符串类型，用来存储文本。

  1
  let name: string = "Alice";

• boolean：布尔类型，值为 true 或 false。

  1
  let isActive: boolean = true;

• array：数组类型，可以指定数组中元素的类型。

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

• tuple：元组类型，用于固定长度和类型的数组。

  1
  let user: [string, number] = ["Alice", 30]

• enum：枚举类型，定义一组命名常量。

  1
  enum Color { Red, Green, Blue }
  2
  let color: Color = Color.Green;

• any：任意类型，适用于不确定的变量类型，但不建议频繁使用。

  1
  let randomValue: any = "hello";
  2
  randomValue = 5;  // 可以重新赋值为其他类型

• void：无返回值，通常用于函数没有返回值的情况。

  1
  function logMessage(): void {
  2
    console.log("This is a message");
  3
  }

• null 和 undefined：表示变量为空或未定义。

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

2. 类型注解#

可以在变量、参数和返回值上添加类型注解，便于代码提示和错误检查。

1
let name: string = "Alice";
2
function greet(name: string): string {
3
  return `Hello, ${name}`;
4
}

3. 接口（Interfaces）#

接口用于定义对象的结构（即包含哪些属性和方法），有助于实现代码的重用和灵活性。

1
interface Person {
2
  name: string;
3
  age: number;
4
  greet(): string;
5
}
6

7
let alice: Person = {
8
  name: "Alice",
9
  age: 30,
10
  greet() {
11
    return `Hello, my name is ${this.name}`;
12
  }
13
};

4. 类（Classes）#

TypeScript 支持面向对象编程，允许使用类和继承。类包含构造函数、属性和方法。

1
class Animal {
2
  name: string;
3

4
  constructor(name: string) {
5
    this.name = name;
6
  }
7

8
  move(distance: number = 0) {
9
    console.log(`${this.name} moved ${distance} meters.`);
10
  }
11
}
12

13
let dog = new Animal("Dog");
14
dog.move(10);

• 访问修饰符

TypeScript 提供三种访问修饰符来控制类成员的访问权限：

• public：公共的，默认修饰符，任何地方都可以访问。
• private：私有的，只能在类内部访问。
• protected：受保护的，允许在类内部及继承的子类中访问。

1
class Person {
2
  public name: string;
3
  private age: number;
4
  protected address: string;
5

6
  constructor(name: string, age: number, address: string) {
7
    this.name = name;
8
    this.age = age;
9
    this.address = address;
10
  }
11
}

5. 泛型（Generics）#

泛型允许定义函数、类或接口时不指定类型，而在使用时再指定类型。这提高了代码的复用性。

1
function identity<T>(arg: T): T {
2
  return arg;
3
}
4

5
let output = identity<string>("Hello");  // T 被推断为 string

6. 类型推断#

TypeScript 会根据代码自动推断变量的类型，如果没有显式声明类型，TypeScript 会根据赋值自动判断类型。

1
let x = 10; // TypeScript 自动推断 x 为 number

7. 联合类型（Union Types）#

联合类型允许一个变量接受多种类型值，使用 | 符号定义。

1
let value: string | number;
2
value = "Hello";
3
value = 42;

8. 类型别名（Type Aliases）#

使用 type 关键字可以为类型定义别名，便于复用。

1
type ID = string | number;
2
let userId: ID = "123";

9. 类型断言（Type Assertions）#

类型断言告诉编译器某个值的具体类型，适用于我们比 TypeScript 更清楚变量的类型的情况。

1
let someValue: any = "This is a string";
2
let strLength: number = (someValue as string).length;

10. 装饰器（Decorators）#

装饰器是 TypeScript 的高级特性，允许在类、方法或属性上应用一些元数据。Angular 中大量使用了装饰器来定义组件、模块等。

1
function log(target: any, key: string) {
2
  console.log(`${key} was called`);
3
}
4

5
class Person {
6
  @log
7
  greet() {
8
    console.log("Hello!");
9
  }
10
}

11. 模块和命名空间#

• 模块：TypeScript 支持 ES6 模块系统，可以通过 import 和 export 实现模块的导入和导出。

  1
  export const pi = 3.14;
  2
  
  3
  // main.ts
  4
  import { pi } from './module';
  5
  console.log(pi);

• 命名空间：TypeScript 提供了命名空间（namespace）来组织代码，适用于大型应用。

  1
  namespace Geometry {
  2
    export function calculateArea(radius: number): number {
  3
      return Math.PI * radius * radius;
  4
    }
  5
  }
  6
  
  7
  console.log(Geometry.calculateArea(5));