typescript基础教程

TypeScript基础教程

TypeScript是一种由Microsoft开发的静态类型语言，是JavaScript的超集，它可以编译成普通的JavaScript代码，并且可以运行在任何支持JavaScript的浏览器或平台上。

安装TypeScript

在开始之前，您需要在本地安装TypeScript。您可以通过npm来安装它，命令如下：

npm install -g typescript

变量声明

在TypeScript中，您可以使用let和const关键字来声明变量，这两个关键字与JavaScript中的用法相同。不同之处在于，TypeScript允许您在声明变量时指定其类型。

let str: string = "Hello, TypeScript!";
const num: number = 42;

函数

在TypeScript中，您可以使用函数来执行一些任务。函数可以接受参数并返回值，如下所示：

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

const result = add(1, 2);
console.log(result); // 输出 3

TypeScript还支持箭头函数：

const multiply = (a: number, b: number): number => {
  return a * b;
}

类

TypeScript是一种面向对象的语言，因此它支持类的定义。类可以具有属性和方法，并且可以继承其他类。

class Person {
  name: string;
  age: number;

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

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

const person = new Person("Alice", 30);
person.sayHello(); // 输出 "Hello, my name is Alice and I'm 30 years old."

接口

接口是一种用于定义对象的结构的方式。在TypeScript中，您可以使用接口来定义对象的属性和方法。

interface Shape {
  name: string;
  numberOfSides: number;
  getArea(): number;
}

class Rectangle implements Shape {
  name = "Rectangle";
  numberOfSides = 4;
  width: number;
  height: number;

  constructor(width: number, height: number) {
    this.width = width;
    this.height = height;
  }

  getArea(): number {
    return this.width * this.height;
  }
}

const rectangle = new Rectangle(5, 10);
console.log(rectangle.getArea()); // 输出 50

泛型

TypeScript支持泛型，这是一种用于创建可重用的代码的方式。您可以使用泛型来定义函数和类。

function reverse<T>(items: T[]): T[] {
  return items.reverse();
}

const numbers = [1, 2, 3, 4, 5];
const reversedNumbers = reverse(numbers);
console.log(reversedNumbers); // 输出 [5, 4, 3, 2, 1]