TypeScript 快速入门
安装 TypeScript
首先,你需要安装 TypeScript。你可以使用 npm 来安装 TypeScript:
bash
复制代码
npm install -g typescript
编译 TypeScript
TypeScript 文件以 .ts
为扩展名。要将 TypeScript 文件编译为 JavaScript 文件,可以使用 tsc
命令:
bash
复制代码
tsc filename.ts
基本类型
TypeScript 提供了多种基本类型,类似于 JavaScript,但增加了类型注释。
typescript
复制代码
let isDone: boolean = false; let age: number = 30; let userName: string = "John"; let list: number[] = [1, 2, 3]; let listGeneric: Array<number> = [1, 2, 3]; let tuple: [string, number] = ["hello", 10];
枚举
枚举类型用于定义数值集合。
typescript
复制代码
enum Color {Red, Green, Blue} let c: Color = Color.Green;
Any 和 Unknown
any
类型可以是任何类型,unknown
类型也是任何类型但更安全。
typescript
复制代码
let notSure: any = 4; notSure = "maybe a string"; notSure = false; let uncertain: unknown = 4; uncertain = "could be a string too";
Void, Null 和 Undefined
void
类型通常用于函数没有返回值时。
typescript
复制代码
function warnUser(): void { console.log("This is my warning message"); } let u: undefined = undefined; let n: null = null;
函数
TypeScript 允许为函数的参数和返回值指定类型。
typescript
复制代码
function add(x: number, y: number): number { return x + y; } let myAdd = function(x: number, y: number): number { return x + y; };
可选参数和默认参数
typescript
复制代码
function buildName(firstName: string, lastName?: string): string { return firstName + " " + (lastName || ""); } function buildNameWithDefault(firstName: string, lastName: string = "Smith"): string { return firstName + " " + lastName; }
接口
接口用于定义对象的类型。
typescript
复制代码
interface Person { firstName: string; lastName: string; } function greeter(person: Person) { return "Hello, " + person.firstName + " " + person.lastName; } let user = { firstName: "Jane", lastName: "Doe" }; console.log(greeter(user));
类
TypeScript 支持基于类的面向对象编程。
typescript
复制代码
class Animal { private name: string; constructor(theName: string) { this.name = theName; } move(distanceInMeters: number = 0) { console.log(`${this.name} moved ${distanceInMeters}m.`); } } let dog = new Animal("Dog"); dog.move(10);
继承
类可以继承其他类。
typescript
复制代码
class Dog extends Animal { constructor(name: string) { super(name); } bark() { console.log("Woof! Woof!"); } } let dog = new Dog("Rex"); dog.bark(); dog.move(10);
泛型
泛型用于创建可重用的组件。
typescript
复制代码
function identity<T>(arg: T): T { return arg; } let output = identity<string>("myString"); // 类型参数明确定义 let output2 = identity("myString"); // 类型参数推断
模块
TypeScript 支持 ES6 模块语法。
typescript
复制代码
// math.ts export function add(x: number, y: number): number { return x + y; } // main.ts import { add } from './math'; console.log(add(5, 3));
类型别名
类型别名用于为类型创建新名称。
typescript
复制代码
type Name = string; type NameResolver = () => string; type NameOrResolver = Name | NameResolver; function getName(n: NameOrResolver): Name { if (typeof n === "string") { return n; } else { return n(); } }
类型断言
类型断言用于告诉编译器某个值的具体类型。
typescript
复制代码
let someValue: any = "this is a string"; let strLength: number = (someValue as string).length;
类型推断
TypeScript 会根据变量的值推断其类型。
typescript
复制代码
let x = 3; // x 被推断为 number
联合类型
联合类型允许一个变量有多种类型。
typescript
复制代码
let value: string | number = "hello"; value = 42;
交叉类型
交叉类型用于将多个类型合并为一个类型。
typescript
复制代码
interface A { a: string; } interface B { b: number; } let ab: A & B = { a: "foo", b: 42 };
类型保护
类型保护用于在运行时检查类型。
typescript
复制代码
function isString(x: any): x is string { return typeof x === "string"; } function example(x: string | number) { if (isString(x)) { console.log(x.toUpperCase()); // 在这里 x 是 string } else { console.log(x.toFixed(2)); // 在这里 x 是 number } }