TypeScript入门指南：30分钟速成

TypeScript 快速入门

TypeScript 是 JavaScript 的超集，增加了静态类型检查和其他特性。以下是快速掌握基础的方法：

安装与配置

通过 npm 全局安装 TypeScript：

bash 复制代码

npm install -g typescript

创建 tsconfig.json 配置文件：

bash 复制代码

tsc --init

基础类型

TypeScript 支持 JavaScript 所有基础类型并扩展了类型注解：

typescript 复制代码

let isDone: boolean = false;
let count: number = 42;
let name: string = "TypeScript";

// 数组
let list: number[] = [1, 2, 3];
let genericList: Array<number> = [1, 2, 3]; // 泛型语法

// 元组
let tuple: [string, number] = ["hello", 10];

接口与类型

使用接口定义对象形状：

typescript 复制代码

interface User {
  name: string;
  age?: number; // 可选属性
  readonly id: number; // 只读属性
}

function greet(user: User): string {
  return `Hello ${user.name}`;
}

类型别名：

typescript 复制代码

type Point = {
  x: number;
  y: number;
};

类与继承

TypeScript 支持 ES6 类语法并扩展了访问修饰符：

typescript 复制代码

class Animal {
  protected name: string;
  
  constructor(name: string) {
    this.name = name;
  }
  
  move(distance: number = 0) {
    console.log(`${this.name} moved ${distance}m`);
  }
}

class Dog extends Animal {
  bark() {
    console.log("Woof! Woof!");
  }
}

泛型

创建可复用的组件：

typescript 复制代码

function identity<T>(arg: T): T {
  return arg;
}

let output = identity<string>("myString");

编译与运行

将 TypeScript 编译为 JavaScript：

bash 复制代码

tsc yourFile.ts

运行编译后的文件：

bash 复制代码

node yourFile.js

实用技巧

使用 any 类型可以绕过类型检查（应尽量避免）

类型断言有两种语法：

typescript 复制代码

let someValue: any = "this is a string";
let strLength1: number = (<string>someValue).length;
let strLength2: number = (someValue as string).length;

启用严格模式可在 tsconfig.json 中设置 "strict": true

通过以上核心概念，可以快速开始 TypeScript 开发。实际项目中建议结合 IDE 的类型提示功能提高开发效率。