TypeScript入门：步入面向未来的前端开发语言-原创手记-慕课网

TypeScript 是一种由微软开发的开源编程语言，它扩展了 JavaScript，提供了一套强大的类型系统，旨在让开发者编写更稳健、易于维护的代码。TypeScript 之所以成为前端开发者的优选，不仅因为它能帮助解决 JavaScript 在大型项目中的局限性，还因为它提供了编译功能，能够将 TypeScript 代码转换为 JavaScript，从而在浏览器或 Node.js 环境中运行。

安装 TypeScript

安装 TypeScript 通常包括以下几个步骤：

1. 使用 Node.js 的包管理器：npm 或 yarn

首先，确保你的计算机上已安装了 Node.js。如果没有，请从 Node.js 官网下载并安装最新版本。

安装 TypeScript，可以使用 npm 或 yarn：

使用 npm：
```
npm install -g typescript
```
使用 yarn：
```
yarn global add typescript
```

安装完成后，你可以通过运行 tsc --version 来验证 TypeScript 的安装情况。

2. 创建 TypeScript 项目

使用命令行工具进入你想要创建 TypeScript 项目的目录，并初始化一个新的项目：

mkdir my-ts-project
cd my-ts-project
npm init -y

接下来，创建一个 tsconfig.json 文件，这是 TypeScript 的配置文件，用于设置编译选项：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "outDir": "dist"
  },
  "include": [
    "src/**/*"
  ]
}

这将告诉 TypeScript 编译目标是 ES5，使用 CommonJS 模块系统，并将输出文件置于 dist 目录下。

基础语法学习

1. 变量与类型

TypeScript 强调类型安全，通过类型注解确保变量的类型得以明确。以下是一个简单的变量声明示例：

let age: number = 25;
age = 30; // 正确

age = "thirty"; // 错误，类型不匹配

2. 函数与参数类型

函数定义时，参数和返回值的类型同样可以明确指定：

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

let message = greet("Alice");
console.log(message); // 输出: Hello, Alice!

3. 数组与枚举

数组类型可以指定元素的类型，而枚举则用于定义一组固定的常量值：

let fruits: string[] = ["apple", "banana", "cherry"];
fruits.push("orange");

const SEASONS = ["spring", "summer", "fall", "winter"];

4. 类与对象

TypeScript 支持面向对象编程，可以定义类和接口来组织代码：

class Person {
  name: string;
  age: number;

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

  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

let person = new Person("Alice", 25);
person.greet(); // 输出: Hello, my name is Alice

类型注解与类型安全

1. 类型注解

在 TypeScript 中，你可以为函数参数和返回值、变量等添加类型注解以提升代码的可读性和安全性：

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

let result = addNumbers(10, 20);
console.log(result); // 输出: 30

2. 类型推断

TypeScript 还能自动推断变量的类型，但在需要时添加类型注解可以增强代码的清晰度：

let num = 5;
let str = "hello";

num = str; // 错误，类型不匹配

实践项目：创建一个简单的命令行应用

项目目标

构建一个简单的命令行应用，用于计算一组数字的平均值。

技术栈

TypeScript
Node.js

代码实现

首先，创建一个名为 app.ts 的文件：

function computeAverage(numbers: number[]): number {
  const sum = numbers.reduce((acc, curr) => acc + curr, 0);
  return sum / numbers.length;
}

function main() {
  const input = process.argv.slice(2).join(" ");
  const numberArray = input.split(" ").map(Number);
  console.log(computeAverage(numberArray));
}

main();

编译与运行

使用 tsc app.ts 编译 TypeScript 文件，然后使用 node app.js 运行编译后的 JavaScript 文件。

示例用法

在命令行中输入数字并运行应用：

node app.js 1 2 3 4 5

输出：

通过这个简单的命令行应用，你已经初步体验了 TypeScript 的强大功能，从类型注解到面向对象编程，再到命令行应用的构建。TypeScript 的类型安全特性可以帮助你构建更加健壮、易于维护的代码库。随着对 TypeScript 深入的了解和实践，你将能够面对更复杂的项目挑战，提高代码质量，提升开发效率。