Programming TypeScript

• 语言: 中文（简体）
• 格式: .pdf
• 来源: b3logfile.com

摘要

文档主要介绍了TypeScript的编译过程和类型系统。TypeScript代码首先被编译器解析为抽象语法树（AST），经类型检查后生成JavaScript代码，而不是直接编译成字节码。类型系统支持显式注解和自动推导两种方式，通常推荐少用显式注解。文档还详细说明了如何初始化TypeScript项目，包括安装必要的包、配置tsconfig.json和tslint.json文件，以及使用ts-node直接运行TypeScript代码。

AI总结

# 《Programming TypeScript》总结

## TypeScript概述

TypeScript是一种静态类型语言，属于JavaScript的超集，性能优越，可在模块化系统中随时渐进式升级到更高版本。

### 编译器工作原理

1. **源代码解析**：编译器将开发者编写的代码解析成抽象句法树（AST），去除空白、注释和缩进符。
2. **AST转换字节码**：编译器将AST转换为字节码，供运行时程序计算，生成结果。
3. **运行时执行**：运行时程序解释并执行字节码，输出最终结果。

### TypeScript的特殊编译过程

1. **TS源码转AST**：TypeScript编译器将源代码解析为AST，并进行类型检查。
2. **AST转JavaScript**：经类型检查后的AST被编译成JavaScript源代码。
3. **JavaScript处理**：生成的JavaScript代码再次被解析为AST，转换为字节码并执行。

**注意**：TypeScript编译为JavaScript时不涉及类型信息，类型仅在检查阶段使用，生成的代码不受影响。

---

## 类型系统

TypeScript支持两种类型系统：
1. 显式注解：通过代码注解告知编译器变量类型。
2. 自动推导：编译器自动推断变量类型，无需显式注解。

**建议**：优先使用自动推导，仅在必要时使用显式注解。

---

## 安装与配置

### 初始化项目

1. 初始化npm项目：

   npm init --yes

2. 安装必要依赖：

   npm install --save-dev typescript tslint @types/node

3. 初始化配置文件：

   npx tsc --init
   npx tslint --init

### 配置说明

#### tsconfig.json

{
  "compilerOptions": {
    "lib": ["ES2015"],
    "module": "commonjs",
    "outDir": "dist",
    "sourceMap": true,
    "strict": true,
    "target": "es5"
  },
  "include": ["src"]
}

- 定义编译选项：包括目标Library、module系统、输出目录、Source Map等。
- 指定包含编译文件：仅编译"src"目录下的文件。

#### tslint.json

{
  "defaultSeverity": "error",
  "extends": ["tslint:recommended"],
  "jsRules": {},
  "rules": {
    "semicolon": false,
    "trailing-comma": false
  },
  "rulesDirectory": []
}

- 配置默认规则严肃性为错误。
- 扩展推荐规则集，无需其他指定规则。

### 开始开发

1. 创建目录及文件：

   mkdir src && touch src/index.ts

2. 添加示例代码：

   console.log('hello TypeScript');

3. 编译并执行：

   npx tsc
   node ./dist/index.js

---

## 进阶工具

- **ts-node**：用于直接运行TypeScript代码，避免额外编译步骤。

  npm i --save-dev ts-node

- **快速初始化脚手架工具**：使用typescript-node-starter快速创建新项目。

  npx typescript-node-starter [projectname]

通过以上步骤，您可以快速配置并开始TypeScript项目开发，同时利用其强大的类型系统提升代码质量。