typescript书写格式，快速上手

1. 声明变量：

let variableName: type = value;

例如：

let name: string = "John";
let age: number = 25;
let isStudent: boolean = true;

2. 声明函数：

function functionName(parameterName: type): returnType {
  // function body
}

例如：

function addNumbers(num1: number, num2: number): number {
  return num1 + num2;
}

3. 声明类：

class ClassName {
  // class body
}

例如：

class Person {
  name: string;
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  sayHello() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

4. 声明接口：

interface InterfaceName {
  // interface body
}

例如：

interface Person {
  name: string;
  age: number;
  isStudent: boolean;
}

5. 声明枚举：

enum EnumName {
  // enum values
}

例如：

enum Color {
  Red,
  Green,
  Blue
}

6. 声明数组：

let arrayName: type[] = [value1, value2, ...];

例如：

let numbers: number[] = [1, 2, 3, 4, 5];
let names: string[] = ["John", "Jane", "Bob"];

7. 声明元组：

let tupleName: [type1, type2, ...] = [value1, value2, ...];

例如：

let person: [string, number] = ["John", 25];

8. 声明联合类型：

let variableName: type1 | type2 | ... = value;

例如：

let age: number | string = 25;
let nameOrAge: string | number = "John";

9. 声明交叉类型：

let variableName: type1 & type2 & ... = value;

例如：

interface Person {
  name: string;
  age: number;
}

interface Student {
  isStudent: boolean;
}

let person: Person & Student = { name: "John", age: 25, isStudent: true };

10. 声明类型别名：

type AliasName = type;

例如：

type Person = {
  name: string;
  age: number;
};

type PersonOrStudent = Person | { isStudent: boolean };

11. 声明可选属性：

interface InterfaceName {
  propertyName?: type;
}

例如：

interface Person {
  name: string;
  age?: number;
}

let person1: Person = { name: "John" };
let person2: Person = { name: "Jane", age: 30 };

12. 声明只读属性：

interface InterfaceName {
  readonly propertyName: type;
}

例如：

interface Person {
  readonly name: string;
  age: number;
}

let person: Person = { name: "John", age: 25 };
person.age = 30; // OK
person.name = "Jane"; // Error: Cannot assign to 'name' because it is a read-only property.

13. 声明函数参数可选：

function functionName(parameterName?: type): returnType {
  // function body
}

例如：

function sayHello(name?: string) {
  if (name) {
    console.log(`Hello, ${name}!`);
  } else {
    console.log("Hello!");
  }
}

sayHello(); // Hello!
sayHello("John"); // Hello, John!

14. 声明函数参数默认值：

function functionName(parameterName: type = defaultValue): returnType {
  // function body
}

例如：

function sayHello(name: string = "World") {
  console.log(`Hello, ${name}!`);
}

sayHello(); // Hello, World!
sayHello("John"); // Hello, John!

15. 声明函数可变参数：

function functionName(...parameterName: type[]): returnType {
  // function body
}

例如：

function sumNumbers(...numbers: number[]): number {
  let sum = 0;
  for (let number of numbers) {
    sum += number;
  }
  return sum;
}

console.log(sumNumbers(1, 2, 3, 4, 5)); // 15

16. 声明函数重载：

function functionName(parameterName: type): returnType;
function functionName(parameterName1: type1, parameterName2: type2): returnType;
// more overloads
function functionName(...args: any[]): any {
  // function body
}

例如：

function addNumbers(num1: number, num2: number): number;
function addNumbers(num1: number, num2: number, num3: number): number;
function addNumbers(...numbers: number[]): number {
  let sum = 0;
  for (let number of numbers) {
    sum += number;
  }
  return sum;
}

console.log(addNumbers(1, 2)); // 3
console.log(addNumbers(1, 2, 3)); // 6

17. 声明类继承：

class ChildClassName extends ParentClassName {
  // child class body
}

例如：

class Student extends Person {
  isStudent: boolean;

  constructor(name: string, age: number, isStudent: boolean) {
    super(name, age);
    this.isStudent = isStudent;
  }

  study() {
    console.log(`${this.name} is studying.`);
  }
}

18. 声明泛型函数：

function functionName<T>(parameterName: T): T {
  // function body
}

例子：

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

19. 声明泛型类：

class ClassName<T> {
  // class body
}

例子：

class Box<T> {
  contents: T;
}

20.声明泛型接口：

interface InterfaceName<T> {
  // interface body
}

例子：

interface Collection<T> {
  add(item: T): void;
  remove(item: T): void;
}

21.声明可选属性：

interface InterfaceName {
  propertyName?: type;
}

例子：

interface Person {
  name?: string;
  age?: number;
}

22.声明只读属性：

interface InterfaceName {
  readonly propertyName: type;
}

例子：

interface Person {
  readonly name: string;
  readonly age: number;
}

23.声明索引签名：

interface InterfaceName {
  [index: type]: returnType;
}

例子：

interface Dictionary {
  [index: string]: string;
}

24.声明可选参数：

function functionName(parameterName?: type): returnType {
  // function body
}

25.声明函数类型：

type FunctionName = (parameterName: type) => returnType;

例子：

type Greeting = (name: string) => string;

26.声明默认参数：

function functionName(parameterName: type = defaultValue): returnType {
  // function body
}

例子：

function greet(name: string = 'World'): string {
  return `Hello, ${name}!`;
}

27. 声明剩余参数：

function functionName(...parameterName: type[]): returnType {
  // function body
}

例子：

function sum(...numbers: number[]): number {
  return numbers.reduce((total, num) => total + num, 0);
}

28.声明函数重载：

function functionName(parameterName: type): returnType;
function functionName(parameterName: type, parameterName: type): returnType;
// etc.

例子：

function add(a: number, b: number): number;
function add(a: string, b: string): string;
function add(a: any, b: any): any {
  return a + b;
}

29.声明模块：

import { importName } from 'moduleName';
export { exportName };

例子：

import { PI } from './constants';
export { addNumbers } from './math';

30.声明类型断言：

let variableName = value as type;

例子：

let age = '25' as number;

31.声明类型保护：

if (variableName instanceof ClassName) {
  // variableName is of type ClassName
}

例子：

function printName(person: Person | string) {
  if (typeof person === 'string') {
    console.log(person.toUpperCase());
  } else {
    console.log(person.name);
  }
}

32.声明类型守卫函数：

function isType(variableName: any): variableName is type {
  // return true if variableName is of type
}

例子：

function isNumber(value: any): value is number {
  return typeof value === 'number';
}