简介

TypeScript 是一种由 Microsoft 开发的开源编程语言，它是 JavaScript 的一个超集，意味着它扩展了 JavaScript 的语法并添加了它自己的特性。与 JavaScript 相比，TypeScript 提供了更严格的类型检查、更好的代码可读性、更少的运行时错误，并且可以大幅提高开发效率。

安装

在开始使用 TypeScript 之前，我们需要先安装 TypeScript 编译器。可以使用 npm 命令进行安装：

npm install -g typescript

安装完成后，可以使用 tsc 命令进行编译 TypeScript 程序。

基础语法

变量和类型

在 TypeScript 中，我们需要在声明变量时显式指定变量的类型，如下所示：

let num: number = 10;
let str: string = "Hello, TypeScript";
let bool: boolean = true;
let arr: number[] = [1, 2, 3];

在这段代码中，我们显式地指定了 num 为 number 类型，str 为 string 类型，bool 为 boolean 类型，arr 为 number 数组类型。

除了基本数据类型之外，TypeScript 还支持元组、枚举、任意类型等数据类型。元组类型表示已知元素数量和类型的数组，例如：

let tuple: [string, number] = ["Hello", 123];

枚举类型是一种包含一组命名常量的集合，例如：

enum Direction {
  Up,
  Down,
  Left,
  Right
}

let dir: Direction = Direction.Up;

任意类型是一种可以代表任何类型的类型，例如：

let anything: any = 10;
anything = "Hello";

函数

在 TypeScript 中，我们可以使用箭头函数的语法来定义函数，如下所示：

let add = (x: number, y: number): number => {
  return x + y;
};

在这段代码中，我们定义了一个箭头函数 add，它接受两个参数，均为 number 类型，并返回一个 number 类型的值。

除了箭头函数语法之外，TypeScript 还支持传统的函数定义方式，例如：

function greet(name: string): void {
  console.log(`Hello, ${name}!`);
}

在这段代码中，我们定义了一个函数 greet，它接受一个字符串类型的参数 name，并且没有返回值（返回值为 void 类型）。

如果我们需要将函数作为参数传递给其他函数，可以使用函数类型，例如：

let func: (x: number, y: number) => number = (x, y) => {
  return x + y;
};

在这段代码中，我们定义了一个函数类型，它接受两个 number 类型的参数，并返回一个 number 类型的值。然后我们使用箭头函数来实现这个函数类型的实际功能，并将它赋值给变量 func。

类

TypeScript 也支持面向对象的编程范式，使用 class 关键字来定义类：

class Animal {
  name: string;

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

  run() {
    console.log(`${this.name} is running.`);
  }
}

在这段代码中，我们定义了一个名为 Animal 的类，它具有一个 string 类型的属性 name 和一个名称为 run 的方法。

我们可以使用 new 关键字来实例化类：

let animal = new Animal("Cat");
animal.run(); // 输出 "Cat is running."

接口

接口在 TypeScript 中扮演着非常重要的角色，用于描述对象的形状和结构。下面是一个简单的接口定义：

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

在这个接口中，我们定义了一个名为 Person 的接口，它具有两个属性：name 和 age，分别为 string 和 number 类型。

可以使用接口来定义对象，如下所示：

let person: Person = {
  name: "小明",
  age: 18
};

泛型

泛型是一种广泛应用于 TypeScript 和其他编程语言中的概念，它可以使函数和类更加通用且复用性更高：

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

let num = identity<number>(10);
let str = identity<string>("Hello");

在这段代码中，我们定义了一个名为 identity 的泛型函数，它接受一个泛型类型的参数 arg，并返回该泛型类型的值。然后我们使用尖括号语法来指定 T 的具体类型，并分别将 10 和 “Hello” 传递给 identity 函数，并将返回值分别赋给 num 和 str 变量。

编译器

TypeScript 编译器可以将 TypeScript 代码编译成 JavaScript 代码，从而在浏览器中运行。下面是一个简单的 TypeScript 源代码文件：

function greeter(name: string) {
  console.log(`Hello, ${name}!`);
}

let user = "TypeScript";
greeter(user);

我们可以使用 tsc 命令进行编译：

tsc greeter.ts

编译完成后，会生成一个相应的 JavaScript 文件：

function greeter(name) {
  console.log(`Hello, ${name}!`);
}

let user = "TypeScript";
greeter(user);

我们可以使用浏览器或者 Node.js 运行生成的 JS 文件，输出结果为：

Hello, TypeScript!

参考文献
TypeScript 官网
TypeScript 入门教程

小结

通过本篇入门教程，我们学习了 TypeScript 的基础语法、数据类型、函数、类以及泛型等概念，并提供了详

文章目录