TypeScript 常见面试题

type SomeFunction = () => string;
 
type FunctionReturnType = ReturnType<SomeFunction>;
// FunctionReturnType 的类型是 string

1 什么是 TypeScript？
TypeScript 是一种由微软开发的自由和开源的编程语言，它是 JavaScript 的一个超集，扩展了 JavaScript 的语法。
TypeScript 是面向对象的 JavaScript。(类)
简单对理解，TypeScript 就是带有类型检测的 JavaScript。

2 为什么要使用 TypeScript？
程序更容易理解（函数或者方法输入输出的参数类型，外部条件等）；
效率更高，在不同代码块和定义中进行跳转，代码补全等；
更少的错误，编译期间能够发现大部分的错误，杜绝一些比较常见的错误；
好的包容性，完成兼容 JavaScript，第三方库可以单独编写类型文件；

TypeScript 的主要特点:
1 跨平台：TypeScript 编译器可以安装在任何操作系统上，包括 Windows、macOS 和 Linux。
2 ES6 特性：TypeScript 包含计划中的 ECMAScript 2015 (ES6) 的大部分特性，例如箭头函数。
3 面向对象的语言：TypeScript 提供所有标准的 OOP 功能，如类、接口和模块。
4 静态类型检查：TypeScript 使用静态类型并帮助在编译时进行类型检查。因此，你可以在编写代码时发现编译时错误，而无需运行脚本。
5 可选的静态类型：如果你习惯了 JavaScript 的动态类型，TypeScript 还允许可选的静态类型。
6 DOM 操作：您可以使用 TypeScript 来操作 DOM 以添加或删除客户端网页元素。

TypeScript是一种静态类型的编程语言，它是JavaScript的超集，具有以下优势：

1. 静态类型检查：TypeScript引入了类型系统，可以在编译时捕获类型错误，提供更早的错误检测和更好的代码健壮性。它能够检查变量类型、函数参数和返回值类型等，帮助开发人员在开发过程中发现潜在的错误。
2. 更好的开发工具支持：TypeScript具有强大的开发工具支持，包括代码补全、类型推断、重构工具等。常用的开发工具如Visual Studio Code等都对TypeScript提供了良好的集成支持，提高了开发效率和代码质量。
3. 渐进式开发：TypeScript允许将现有的JavaScript代码逐步迁移到TypeScript，而无需一次性重写整个代码库。你可以根据需要选择性地给现有的JavaScript文件添加类型注解，并逐步引入类型检查。
4. 更好的代码可维护性：TypeScript提供了面向对象编程的特性，如类、接口、模块等，使得代码更结构化、可组织性更强，并且更易于维护和重构。
5. 社区支持和生态系统：TypeScript拥有庞大的开发者社区和丰富的第三方库生态系统，可以方便地共享和重用代码。许多流行的JavaScript库和框架，如React、Angular和Vue.js，都提供了TypeScript的支持。

数字类型：用于表示数字类型的值。TypeScript 中的所有数字都存储为浮点值。
let identifier: number = value;
布尔类型：一个逻辑二进制开关，包含true或false

let identifier: string = " ";
Null 类型： Null 表示值未定义的变量。

let identifier: bool = Boolean value;
未定义类型：一个未定义的字面量，它是所有变量的起点。

let num: number = null;
void 类型：分配给没有返回值的方法的类型。

let unusable: void = undefined;

当前的稳定版本是 4.9

接口是我们在进行模块、方法等的封装时经常会用到的一个概念，使用接口可以：
将一类具体事务抽象成单一的对象方法，使用者不必关心内部的实现逻辑，只需要按照要求传入对应的参数即可得到预期的结果输出，从很大程度上减轻了使用者的心智负担。
一处定义，多处使用，减轻后续的维护负担。
TypeScript 也有接口的概念，它被用来校验数据类型是否符合要求。
TypeScript 接口就像是一份具有名称的契约或者规则，契约的内容规定了某个数据结构里面的数据组成和类型，只要有某处通过名称调用了这份契约，那就意味着此处的数据必须要接受并通过契约内容的检查，否则会报错。

interface IEmployee {
empCode: number;
empName: string;
getSalary: (number) => number; // arrow function
getManagerName(number): string;
}

一、模块的概念和作用
模块是一个独立的代码单元，它包含了相关的变量、函数、类等代码，并且可以被其他模块导入和使用。模块的主要作用包括：
1. 封装和隐藏实现细节：
模块可以将内部实现细节隐藏起来，只暴露对外可见的接口。这样可以提高代码的安全性和可维护性。
2. 代码的复用和组织：
模块提供了一种将相关功能和数据组织在一起的方式，使得我们可以在不同的项目中重复使用模块，提高代码的复用性和可读性。
3. 避免全局命名冲突：
模块中的变量、函数、类等代码都处于模块的作用域内，避免了全局命名冲突的问题，提高了代码的可靠性。
4. 加载和依赖管理：
模块系统提供了加载和管理依赖关系的机制，使得我们可以在需要的时候动态加载模块，并解决模块之间的依赖关系。
通过使用模块，我们可以更好地组织和管理我们的代码，提高代码的可维护性和可扩展性。

二、导入和导出模块
在TypeScript中，我们可以使用import和export关键字来导入和导出模块。以下是一些常见的模块导入和导出方式：

导出方式：
默认导出（Default Export）：一个模块可以默认导出一个默认的值，例如一个函数、类或对象。可以使用export default语法来进行默认导出。例如：
// mathUtils.ts
export default function add(a: number, b: number): number {
return a + b;
}
命名导出（Named Export）：一个模块可以导出多个命名的值，例如函数、类或对象。可以使用export关键字来进行命名导出。例如：
// mathUtils.ts
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
组合导出（Re-export）：一个模块可以导出其他模块的导出项，实现对外统一的接口。可以使用export关键字加上*或as关键字来进行组合导出。例如：
// utils.ts
export * from './mathUtils';
export { someFunction as aliasFunction } from './otherModule';
导入方式：
在使用模块时，我们可以使用import关键字来导入其他模块的导出项。以下是一些常见的导入方式：网址:yii666.com<
导入默认导出：可以使用import关键字加上被导出模块的名称来导入默认导出。例如：
// main.ts
import add from './mathUtils';
导入命名导出：可以使用import关键字加上花括号{}来导入命名导出。例如：
// main.ts
import { add, subtract } from './mathUtils';
导入组合导出：可以使用import关键字加上*来导入组合导出的模块。例如：网址:yii666.com
// main.ts
import * as utils from './utils';
通过导入和导出模块的方式，我们可以在不同的文件之间共享代码，并在需要时引入相关的功能。
三、模块的加载器
在浏览器环境中，为了加载和管理模块，我们需要使用模块加载器（Module Loader）。一些常用的模块加载器包括：
Webpack：一个功能强大的打包工具，可以将多个模块打包成一个或多个静态资源文件。
Parcel：一个快速、零配置的打包工具，可以自动处理模块的加载和依赖。
SystemJS：一个通用的模块加载器，可以在浏览器中动态加载模块，并解决模块之间的依赖关系。
这些模块加载器可以根据配置文件或约定来加载、解析和执行模块。
四、使用第三方模块
在TypeScript中，我们可以使用第三方模块（External Module），这些模块由其他人编写并提供给我们使用。为了使用第三方模块，我们需要先安装它们，然后使用import语句导入模块。
例如，我们可以使用npm包管理器安装第三方模块，并导入它们：文章来源地址https://www.yii666.com/blog/605578.html
// 安装第三方模块
npm install lodash
// 导入第三方模块
import * as _ from 'lodash';
通过使用第三方模块，我们可以借助其他人的代码来加快开发速度，提高代码质量。
总结
模块是TypeScript中非常重要的特性，它是代码组织和模块化的利器，让我们能够更好地组织、管理和共享我们的代码。通过模块化的开发方式，我们能够构建出更健壮、可维护和可扩展的应用程序。

你可以将 Node.js 与 TypeScript 结合使用，将 TypeScript 的优势带入后端工作。
只需输入以下命令，即可将 TypeScript 编译器安装到你的 Node.js 中：
npm i -g typescript

TypeScript 中的类型断言的工作方式类似于其他语言中的类型转换，但没有 C# 和 Java 等语言中可能的类型检查或数据重组。类型断言对运行时没有影响，仅由编译器使用。

类型断言本质上是类型转换的软版本，它建议编译器将变量视为某种类型，但如果它处于不同的形式，则不会强制它进入该模型

变量是存储位置，用于存储要被程序引用和使用的值/信息。它充当程序中值的容器。可以使用var关键字声明它。它应该在使用前声明。在Typescript中声明变量时，应该遵循某些规则-

变量名必须是字母或数字。
变量名不能以数字开头。
变量名不能包含空格和特殊字符，除了下划线(_)和美元($)符号

你可以通过三种方式创建变量：var，let，和const。
var是严格范围变量的旧风格。你应该尽可能避免使用，var因为它会在较大的项目中导致问题。
var num:number = 1;
let是在 TypeScript 中声明变量的默认方式。与var相比，let减少了编译时错误的数量并提高了代码的可读性。
let num:number = 1;
const创建一个其值不能改变的常量变量。它使用相同的范围规则，let并有助于降低整体程序的复杂性。
const num:number = 100;

你可以使用该super()函数来调用基类的构造函数。

class Animal {
name: string;
constructor(theName: string) {
this.name = theName;
}
move(distanceInMeters: number = 0) {
console.log(`${this.name} moved ${distanceInMeters}m.`);
}
}
class Snake extends Animal {
constructor(name: string) {
super(name);
}
move(distanceInMeters = 5) {
console.log("Slithering...");
super.move(distanceInMeters);
}
}

Mixin 本质上是在相反方向上工作的继承。Mixins 允许你通过组合以前类中更简单的部分类设置来构建新类。

相反，类A继承类B来获得它的功能，类B从类A需要返回一个新类的附加功能

你可以使用 juggle-check，它检查 null 和 undefined，或者使用 strict-check，它返回true设置为null的值，并且不会评估true未定义的变量。

//juggle
if (x == null) {
}

var a: number;
var b: number = null;
function check(x, name) {
if (x == null) {
console.log(name + ' == null');
}
if (x === null) {
console.log(name + ' === null');
}
if (typeof x === 'undefined') {
console.log(name + ' is undefined');
}
}
check(a, 'a');
check(b, 'b');

Getter 和 setter 是特殊类型的方法，可帮助你根据程序的需要委派对私有变量的不同级别的访问。

Getters 允许你引用一个值但不能编辑它。Setter 允许你更改变量的值，但不能查看其当前值。这些对于实现封装是必不可少的。

例如，新雇主可能能够了解get公司的员工人数，但无权set了解员工人数。

const fullNameMaxLength = 10;
class Employee {
private _fullName: string = "";
get fullName(): string {
return this._fullName;
}
set fullName(newName: string) {
if (newName && newName.length > fullNameMaxLength) {
throw new Error("fullName has a max length of " + fullNameMaxLength);
}
this._fullName = newName;
}
}
let employee = new Employee();
employee.fullName = "Bob Smith";
if (employee.fullName) {
console.log(employee.fullName);
}

你可以使用export关键字打开模块以供在模块外使用。

module Admin {
// use the export keyword in TypeScript to access the class outside
export class Employee {
constructor(name: string, email: string) { }
}
let alex = new Employee('alex', 'alex@gmail.com');
}
// The Admin variable will allow you to access the Employee class outside the module with the help of the export keyword in TypeScript
let nick = new Admin.Employee('nick', 'nick@yahoo.com');

与 JavaScript 类似，你可以使用parseInt或parseFloat函数分别将字符串转换为整数或浮点数。你还可以使用一元运算符+将字符串转换为最合适的数字类型，“3”成为整数，3而“3.14”成为浮点数3.14。

var x = "32";
var y: number = +x;

.map文件是源地图，显示原始打字稿代码是如何解释成可用的JavaScript代码。它们有助于简化调试，因为你可以捕获任何奇怪的编译器行为。

调试工具还可以使用这些文件来允许你编辑底层的 TypeScript 而不是发出的 JavaScript 文件。

类表示一组相关对象的共享行为和属性。

例如，我们的类可能是Student，其所有对象都具有该attendClass方法。另一方面，John是一个单独的 type 实例，Student可能有额外的独特行为，比如attendExtracurricular.

你使用关键字声明类class：

class Student {
studCode: number;
studName: string;
constructor(code: number, name: string) {
this.studName = name;
this.studCode = code;
}

JSX 是一种可嵌入的类似于 XML 的语法，允许你创建 HTML。TypeScript 支持嵌入、类型检查和将 JSX 直接编译为 JavaScript

TypeScript有内置的支持preserve，react和react-native。
preserve 保持 JSX 完整以用于后续转换。
react不经过 JSX 转换，而是react.createElement作为.js文件扩展名发出和输出。
react-native结合起来preserve，react因为它维护所有 JSX 和输出作为.js扩展。

你需要调用 TypeScript 编译器tsc来编译文件。你需要安装 TypeScript 编译器，你可以使用npm.

npm install -g typescript
tsc

全局作用域：在任何类之外定义，可以在程序中的任何地方使用。
函数/类范围：在函数或类中定义的变量可以在该范围内的任何地方使用。
局部作用域/代码块：在局部作用域中定义的变量可以在该块中的任何地方使用

Lambda 函数 又称箭头函数

箭头函数表达式语法比函数表达式语法更简短，并且没有自己的this，arguments,super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方，并且它不能用作构造函数。

ES6版本的TypeScript 提供的箭头函数，是定义匿名函数的简写语法，用于函数表达式，省略了function关键字。箭头函数具有this 关键的语法作用。

箭头函数的作用：

当我们不需继续输入功能；
它从词汇上捕捉这个关键字的含义；
它从词汇上抓住了参数的意义。
语法

可以分三部分

参数：函数可以有参数，也可以没有参数
箭头符号：=>
语句： 表示函数的指令集
如果用箭头函数表示法，就不需要使用function 关键字。参数在（）中传递，函数表达式在{}中

其余参数允许你将不同数量的参数（零个或多个）传递给函数。当你不确定函数将接收多少参数时，这很有用。其余符号之后的所有参数...都将存储在一个数组中。
例如：

function Greet(greeting: string, ...names: string[]) {
return greeting + " " + names.join(", ") + "!";
}
Greet("Hello", "Steve", "Bill"); // returns "Hello Steve, Bill!"
Greet("Hello");// returns "Hello !"
rest 参数必须是参数定义的最后一个，并且每个函数只能有一个 rest 参数

三斜线指令是单行注释，包含用作编译器指令的 XML 标记。每个指令都表示在编译过程中要加载的内容。三斜杠指令仅在其文件的顶部工作，并且将被视为文件中其他任何地方的普通注释。
/// 是最常见的指令，定义文件之间的依赖关系。
/// 类似于path但定义了包的依赖项。
/// 允许您显式包含内置lib文件。

Omit是实用程序类型的一种形式，它促进了常见的类型转换。Omit允许你通过传递电流Type并选择Keys在新类型中省略来构造类型。

Omit
例如：

interface Todo {
title: string;
description: string;
completed: boolean;
createdAt: number;
}
type TodoPreview = Omit;

要在 TypeScript 中重载函数，只需创建两个名称相同但参数/返回类型不同的函数。两个函数必须接受相同数量的参数。这是 TypeScript 中多态性的重要组成部分。

例如，你可以创建一个add函数，如果它们是数字，则将两个参数相加，如果它们是字符串，则将它们连接起来。

function add(a:string, b:string):string;
function add(a:number, b:number): number;
function add(a: any, b:any): any {
return a + b;
}
add("Hello ", "Steve"); // returns "Hello Steve"
add(10, 20); // returns 30

有一种方法可以做到这一点：

interface CreateDTO {
id: string;
name: string;
price: number;
}

interface UpdateDTO extends Partial {}
但是使用类，类似这样：

class CreateDTO {
id: string;
name: string;
price: number;
}

class UpdateDTO extends Partial {}
问题是我必须使用类而不是接口，因为我必须为验证添加装饰器。

any、unknown、never、void区别
定义
any:用于描述任意类型的变量 不作任何约束 编译时会跳过对其的类型检查
unknown: 表示未知类型,即写代码的时候还不知道具体会是怎么的数据类型
never:永不存在的值的类型 常用于表示永不能执行到终点的函数返回值，例如抛出异常或函数中执行无限循环的代码的函数返回值类型
void: 表示无任何类型，没有类型，例如没有返回值的函数的返回值类型
any与unknown的区别
unknown与any类似 但使用前必须进行类型断言或守卫

never 与void的区别
用于函数时 never表示函数用于执行不到返回值那一步(抛出异常或死循环)的返回值类型，即永不存在值的类型，
而void则表示没有返回值，不返回或返回undefined

装饰器是一种特殊的声明，它允许你通过使用@注释标记来一次性修改类或类成员。每个装饰器都必须引用一个将在运行时评估的函数。

例如，装饰器@sealed将对应于sealed函数。任何标有 的@sealed都将用于评估sealed函数。

function sealed(target) {
// do something with 'target' ...
}
它们可以附加到：
类声明
方法
配件
特性
参数
注意：默认情况下不启用装饰器。要启用它们，你必须experimentalDecorators从tsconfig.json文件或命令行编辑编译器选项中的字段

unknown 和 any 的主要区别是 unknown 类型会更加严格：在对 unknown 类型的值执行大多数操作之前，我们必须进行某种形式的检查。而在对 any 类型的值执行操作之前，我们不必进行任何检查。

举例说明：
let foo: any = 123;
console.log(foo.msg); // 符合TS的语法
let a_value1: unknown = foo; // OK
let a_value2: any = foo; // OK
let a_value3: string = foo; // OK
let bar: unknown = 222; // OK
console.log(bar.msg); // Error
let k_value1: unknown = bar; // OK
let K_value2: any = bar; // OK
let K_value3: string = bar; // Error


因为bar是一个未知类型(任何类型的数据都可以赋给 unknown 类型)，所以不能确定是否有msg属性。不能通过TS语法检测；而 unknown 类型的值也不能将值赋给 any 和 unknown 之外的类型变量

总结：

any 和 unknown 都是顶级类型，但是 unknown 更加严格，不像 any 那样不做类型检查，反而 unknown 因为未知性质，不允许访问属性，不允许赋值给其他有明确类型的变量。

通过类型批注提供在编译时启动类型检查的静态类型，这是可选的，而且可以忽略而使用JavaScript常规的动态类型
function Add(left: number, right: number): number {
return left + right;
}

TypeScript是微软公司开发和维护的一种面向对象的编程语言。它是JavaScript的超集，包含其所有元素。

强类型和弱类型、静态类型和动态类型是两组不同的概念。

类型强弱是针对类型转换是否显示来区分，静态和动态类型是针对类型检查的时机来区分。

TS对JS的改进主要是静态类型检查，静态类型检查有何意义？标准答案是“静态类型更有利于构建大型应用”。

推荐使用TypeScript的原因有：

TypeScript简化了JavaScript代码，使其更易于阅读和调试。
TypeScript是开源的。
TypeScript为JavaScript ide和实践（如静态检查）提供了高效的开发工具。
TypeScript使代码更易于阅读和理解。
使用TypeScript，我们可以大大改进普通的JavaScript。
TypeScript为我们提供了ES6（ECMAScript 6）的所有优点，以及更高的生产率。
TypeScript通过对代码进行类型检查，可以帮助我们避免在编写JavaScript时经常遇到的令人痛苦的错误。
强大的类型系统，包括泛型。
TypeScript只不过是带有一些附加功能的JavaScript。
TypeScript代码可以按照ES5和ES6标准编译，以支持最新的浏览器。
与ECMAScript对齐以实现兼容性。
以JavaScript开始和结束。
支持静态类型。
TypeScript将节省开发人员的时间。
TypeScript是ES3、ES5和ES6的超集。

TypeScript Generics 是提供创建可重用组件的方法的工具。 它能够创建可以使用多种数据类型而不是单一数据类型的组件。 而且，它在不影响性能或生产率的情况下提供了类型安全性。 泛型允许我们创建泛型类，泛型函数，泛型方法和泛型接口。

在泛型中，类型参数写在左括号（<）和右括号（>）之间，这使它成为强类型集合。 它使用一种特殊的类型变量来表示类型。

function identity < T > (arg: T) : T {
return arg;
}
let output1 = identity < string > ("edureka");
let output2 = identity < number > (117);
console.log(output1);
console.log(output2);

【1】相同点
都可以描述一个对象或者函数
interface User {
name: string age: number
}
interface SetUser { (name: string, age: number) : void;
}

type User = {
name: string age: number
};
type SetUser = (name: string, age: number) = >void;

都允许拓展（extends）
interface 和 type 都可以拓展，并且两者并不是相互独立的，也就是说 interface 可以 extends type, type 也可以 extends interface 。 虽然效果差不多，但是两者语法不同。

// 1、interface extends interface
interface Name {
name: string;
}
interface User extends Name {
age: number;
}
// 2、type extends type
type Name = {
name: string;
}
type User = Name & { age: number };
// 3、interface extends type
type Name = {
name: string;
}
interface User extends Name {
age: number;
}
// 4、type extends interface
interface Name {
name: string;
}
type User = Name & {
age: number;
}

【2】不同点
type 可以而 interface 不行
type 可以声明基本类型别名，联合类型，元组等类型
// 基本类型别名
type Name = string
// 联合类型
interface Dog {
wong();
}
interface Cat {
miao();
}

type Pet = Dog | Cat

// 具体定义数组每个位置的类型
type PetList = [Dog, Pet]
type 语句中还可以使用 typeof 获取实例的 类型进行赋值

// 当你想获取一个变量的类型时，使用 typeof
let div = document.createElement('div');
type B = typeof div
其他骚操作
type StringOrNumber = string | number;
type Text = string | { text: string };
type NameLookup = Dictionary;
type Callback = (data: T) => void;
type Pair = [T, T];
type Coordinates = Pair;
type Tree = T | { left: Tree, right: Tree };
interface 可以而 type 不行
interface 能够声明合并
interface User {
name: string
age: number
}
interface User {
sex: string
}
/*
User 接口为 {
name: string
age: number
sex: string
}
*/
一般来说，如果不清楚什么时候用interface/type，能用 interface 实现，就用 interface , 如果不能就用 type 。

TypeScript 可以与 Angular 和 React 等流行的前端框架以及用于服务器端开发的 Node.js 等各种工具和库一起使用。
TypeScript 代码可以编译成纯 JavaScript，使其与任何支持 JavaScript 的环境兼容

Typescript 使用类型系统在编译时执行类型检查。这可以通过允许在代码运行之前检测到错误来提高代码的可靠性和可维护性。

TypeScript 的类型系统是可选的，因此，开发人员可以随心所欲地使用它

TypeScript 中的模块可以在声明类、函数或变量之前使用 export 关键字来定义。然后可以使用 import 关键字以及包含导出的文件的路径将这些导出导入到另一个文件中。

这是一个例子：
// math.ts
export function add(a: number, b: number): number {
return a + b;
}
// main.ts
import { add } from './math';
console.log(add(1, 2));

TypeScript 命名空间提供了一种以类似于模块的方式组织代码的方式，但语法略有不同。

命名空间允许将代码分组在通用名称下，从而避免名称冲突。但是，在 TypeScript 中，命名空间不像模块那样常用。

因为模块提供的功能更多，适合大型项目。

可以使用 namespace 关键字后跟命名空间名称来定义 TypeScript 命名空间。
您可以使用声明关键字将代码添加到命名空间。
下面是一个例子。
namespace MyApp {
export function doSomething() {
console.log('Doing something');
}
}
MyApp.doSomething();

TypeScript 装饰器是使用返回所需行为的函数创建的。
然后，可以通过在应用装饰器的类、方法或属性的声明之前描述@符号来应用装饰器
这是一个例子
function Logger(target: any, propertyKey: string) {
console.log(`Calling ${propertyKey}`);
}
class MyClass {
@Logger
greet() {
console.log('Hello');
}
}
const instance = new MyClass();
instance.greet(); // Calling greet \n Hello

TypeScript let 和 const 用于变量声明。let 和 const 之间的主要区别在于 let 可以重新分配变量，而 const 不能。

声明为 const 的变量在初始分配后不能更改其值

TypeScript 的 var 和 let 用于声明变量，但它们有不同的作用域规则。用 var 声明的变量具有函数范围，只能在声明它的函数内访问。
用 let 声明的变量具有块作用域，只能在声明它们的块内访问。
通常建议在 TypeScript 中使用 let 而不是 var。

TypeScript any type 用于指示变量、函数或参数可以保存任何类型的值。

在处理外部库或不是用 TypeScript 编写的代码时，或者在需要禁用特定变量的类型检查时，任何类型都是有用的。

但是，尽可能使用更具体的类型通常是个好主意。这是因为使用 any 可能会削弱使用 TypeScript 类型系统的好处。

TypeScript 的 void 类型用于指示函数不返回值。void 类型对于定义执行某些操作但不返回值的函数很有用

TypeScript 的 never 类型用于指示永远不会到达某个值或函数。never 类型可用于指示函数抛出错误或变量没有值

TypeScript 中的 async/await 用于编写易于阅读和维护的异步代码。异步函数返回一个promise，并且await 关键字可用于在继续执行代码之前等待promise的解决。这允许以类似于同步代码的方式编写异步代码，使其更易于理解和维护。
这是一个例子：
async function fetchData(): Promise {
const response = await fetch('https://api.example.com');
const data = await response.json();
return data;
}
fetchData().then(data => {
console.log(data);
});

TypeScript 支持类型推断，这意味着它可以根据分配给它们的值自动确定变量和表达式的类型。这可以简化代码并减少所需的显式类型注释的数量。例如，在下面的代码中，TypeScript 会推断出 x 的类型是数字：
let x = 1;
类型推断也可用于函数返回类型和泛型类型，使其成为编写简洁且可维护的 TypeScript 代码的强大工具

tsc --outFile comman.js file1.ts file2.ts file3.ts
这样就将三个ts文件合并到comman.js文件中
tsc --outFile file1.ts file2.ts file3.ts
当我们不提供输出文件名像上面的命令，然后file2.ts和file3.ts将被编译，并将输出放在file1.ts中，现在是file1.ts包含JavaScript代码
如何自动编译ts文件，并且自动修改ts文件
tsc --watch file1.ts

1模块
2.类
3.接口
4.继承
5.数据类型
6.成员函数

继承是一种从另一个类获取一个类的属性和行为的机制。继承成员的类称为基类，继承这些成员的类称为派生类。
class Shape {
Area:number
constructor(area:number) {
this.Area = area
}
}
class Circle extends Shape {
display():void {
console.log("圆的面积: "+this.Area)
}
}
var obj = new Circle(320);
obj.display()

const用于变量，readonly用于属性
const在运行时检查，readonly在编译时检查
使用const变量保存的数组，可以使用push，pop等方法。但是如果使用Readonly Array声明的数组不能使用push，pop等方法

interface X {
a: number
b: string
}
type X = {
a: number
b: string
}

interface用于描述对象的形状和结构，可以给数据增加类型，而且方便进行复用。而type是通过别名进行重新定义类型的，类型别名指的是为类型创建新名称，需要注意的是，我们并没有定义一个新类型。两者是对接口定义的两种不同形式，目的都是在于定义对象的形状和结构。

但是，两者还是有些许差别：

interface和type都能够被扩展，interface可以拓展type，但是type不能继承interface
类可以以相同的方式实现(implements)接口或类型别名，但类不能实现使用类型别名定义的联合类型。
type 可以使用联合类型和交集，interface 不能使用联合类型和交集组合
类型别名声明可用于任何基元类型、联合或交集。在这方面，interface被限制为对象类型和函数签名。
interface可以实现声明合并，type不能实现声明合并

as是TypeScript中类型断言的附加语法，引入as-语法的原因是原始语法()与JSX冲突

let empCode: any = 111;
let employeeCode = code as number;
// 当使用带有JSX的TypeScript时，只允许as风格的断言

枚举是一种数据类型，允许我们定义一组命名常量。使用枚举可以更容易地记录意图，或者创建一组不同的案例。它是相关值的集合，可以是数值或字符串值。
enum Gender {
Male,
Female
Other
}
console.log(Gender.Female); // : 1
// 我们还可以通过enum值的number值来访问它
console.log(Gender[1]); // : Female

声明合并是编译器随后合并两个或多个独立声明的过程。将具有相同名称的声明为单个定义。这个合并的定义具有两个原始声明的特性。
最简单也是最常见的声明合并类型是接口合并
interface Cloner {
clone(animal: Animal): Animal;
}
interface Cloner {
clone(animal: Sheep): Sheep;
}
interface Cloner {
clone(animal: Dog): Dog;
clone(animal: Cat): Cat;
}
将这三个接口合并为一个单独声明
interface Cloner {
clone(animal: Dog): Dog;
clone(animal: Cat): Cat;
clone(animal: Sheep): Sheep;
clone(animal: Animal): Animal;
}

?. 可选链
?? 类似与短路或，??避免了一些意外情况，0，NaN以及"",false被视为false值。只有undefind,null被视为false值。
!. 在变量名后添加!，可以断言排除undefined和null类型
_ , 声明该函数将被传递一个参数，但您并不关心它
!: 待会分配这个变量，ts不要担心
** 求幂

TypeScript有以下缺点:

TypeScript需要很长时间来编译代码。
TypeScript不支持抽象类。
如果我们在浏览器中运行TypeScript应用程序，需要一个编译步骤将TypeScript转换成JavaScript。
Web开发人员使用了几十年的JavaScript，而TypeScript不是都是新东西。
要使用任何第三方库，必须使用定义文件。并不是所有第三方库都有可用的定义文件。
类型定义文件的质量是一个问题，即如何确保定义是正确的?

语言language
该语言由新语法、关键字、类型注释等元素组成，允许我们编写TypeScript。

编译器compiler
TypeScript编译器是开源的、跨平台的，是用TypeScript编写的。它将用TypeScript编写的代码转换为JavaScript代码。它执行从TypeScript代码到JavaScript代码的解析和类型检查。它还可以帮助将不同的文件连接到单个输出文件，并生成源映射。

语言服务language service
语言服务提供信息，帮助编辑器和其他工具提供更好的辅助功能，如自动重构和智能感知

TypeScript可以通过npm (node .js包管理器)在node的帮助下进行安装和管理。要安装TypeScript，首先要确保npm安装正确，然后运行以下命令在系统上全局安装TypeScript。

$ npm install -g typescript
它安装一个命令行代码“tsc”，它将进一步用于编译我们的Typescript代码。确保检查系统上安装的Typescript版本。

安装TypeScript需要以下步骤:

下载并运行节点的.msi安装程序。
输入命令“node -v”检查安装是否成功。
在终端窗口中输入以下命令安装Typescript: $ npm install -g Typescript

这是可以的，自动实时根据.ts文件变化自动编译.ts文件是可以的。这可以通过使用——watch compiler选项来实现
tsc --watch file1.ts
上面的命令首先编译file1为file1.js，并注意文件的变化，如果检测到任何更改，它将再次编译文件。这里，我们需要确保在使用——watch选项运行时命令提示符不能关闭。

Internal modules (section 9.2.2) are local or exported members of other modules (including the global module and external modules). Internal modules are declared using ModuleDeclarations that specify their name and body. A name path with more than one identifier is equivalent to a series of nested internal module declarations.

External modules (section 9.4) are separately loaded bodies of code referenced using external module names. An external module is written as a separate source file that contains at least one import or export declaration. In addition, external modules can be declared using AmbientModuleDeclarations in the global module that directly specify the external module names as string literals. This is described further in section 0.

根据我的理解，我认为外部模块对应于打字稿文件，而没有包含仅导出一组类型和/或变量的模块定义。 从另一个打字稿文件中，我可以使用import foo = module("foo");简单地将外部模块导入foo.ts中。

有人可以向我解释外部和内部模块之间的关系吗？

规范的9.3和9.4节对此进行了更清晰的说明。我将在此重现这些部分中给出的一些示例。

外部模块

假设以下代码在main.ts中。
import log = module("log");
log.message("hello");
该文件引用了由log.ts导出的内容定义的外部模块log。
export function message(s: string) {
console.log(s);
}
请注意，log.ts不在任何地方使用module关键字。它只是使用export导出内容。

内部模块
该文件具有两个内部模块X.Y.Z
module A.B.C {
import XYZ = X.Y.Z;
export function ping(x: number) {
if (x > 0) XYZ.pong(x – 1);
}
}
module X.Y.Z {
import ABC = A.B.C;
export function pong(x: number) {
if (x > 0) ABC.ping(x – 1);
}
}
它们的行为(大多)类似于外部模块，但是它们包含在一个文件中，您不必引用任何外部文件即可使用它们。定义它们时，它们必须包含在module块中。

是的，TypeScript支持函数重载。但是它的实现很奇怪，当我们在TypeScript中执行函数重载时，我们只能实现一个带有多个签名的函数。

//带有字符串类型参数的函数
function add(a:string, b:string): string;

//带有数字类型参数的函数
function add(a:number, b:number): number;

//函数定义
function add(a: any, b:any): any {
return a + b;
}
在上面的例子中，前两行是函数重载声明。它有两次重载，第一个签名的参数类型为string，而第二个签名的参数类型为number。第三个函数包含实际实现并具有any类型的参数。任何数据类型都可以接受任何类型的数据。然后，实现检查所提供参数的类型，并根据供应商参数类型执行不同的代码段。

是的。要调试任何TypeScript文件，我们需要.js源映射文件。因此，使用—sourcemap标志编译.ts文件以生成源映射文件。
$ tsc -sourcemap file1.ts
这将创建file1.js和file1.js.map，而file1.js的最后一行是源映射文件的引用。
//# sourceMappingURL=file1.js.map

ypeScript定义管理器(TSD)是一个包管理器，用于直接从社区驱动的DefinitelyTyped库中搜索和安装TypeScript定义文件。

假设我们想在.ts文件中使用一些jQuery代码。

$(document).ready(function() { //Your jQuery code });
现在，当我们尝试使用tsc编译它时，它会给出一个编译时错误: 找不到名称“$”。因此，我们需要通知TypeScript编译器“$”属于jQuery。要做到这一点，TSD就要发挥作用。我们可以下载jQuery类型定义文件并将其包含在.ts文件中。以下是实现这一目标的步骤:

首先,安装TSD中。

$ npm install tsd -g
在TypeScript目录中，通过运行创建一个新的TypeScript项目

$ tsd init
然后安装jQuery的定义文件。

tsd query jquery --action install
上面的命令将下载并创建一个包含以“.d.ts”结尾的jQuery定义文件的新目录。现在，通过更新TypeScript文件以指向jQuery定义来包含定义文件。

///
$(document).ready(function() { //To Do
});
现在，再次编译。这次将生成js文件，没有任何错误。因此，TSD的需要帮助我们获得所需框架的类型定义文件

所有的JavaScript库/框架都没有TypeScript声明文件，但是我们希望在TypeScript文件中使用它们时不会出现编译错误。为此，我们使用declare关键字。在我们希望定义可能存在于其他地方的变量的环境声明和方法中，可以使用declare关键字。

例如，假设我们有一个名为myLibrary的库，它没有TypeScript声明文件，在全局命名空间中有一个名为myLibrary的命名空间。如果我们想在TypeScript代码中使用这个库，我们可以使用以下代码:

declare var myLibrary;
TypeScript运行时将把myLibrary变量赋值为任意类型。这是一个问题，我们不会得到智能感知在设计时，但我们将能够使用库在我们的代码。

我们可以使用tsc编译器从任何.ts文件生成TypeScript定义文件。它将生成一个TypeScript定义，使我们的TypeScript文件可重用。
tsc --declaration file1.ts

tsconfig.son文件是json格式的文件。tsconfig.json文件中，我们可以指定各种选项告诉编译器如何编译当前项目。目录中存在tsconfig.json文件，表明该目录是TypeScript项目的根目录。 下面是一个示例tsconfig.json文件。

{
"compilerOptions": {
"declaration": true,
"emitDecoratorMetadata": false,
"experimentalDecorators": false,
"module": "none",
"moduleResolution": "node"
"removeComments": true,
"sourceMap": true
},
"files": [
"main.ts",
"othermodule.ts"
]
}

TypeScript Map文件是一个源映射文件，其中包含有关我们原始文件的信息。
.map文件是源映射文件，可让工具在发出的JavaScript代码和创建它的TypeScript源文件之间进行映射。
许多调试器可以使用这些文件，因此我们可以调试TypeScript文件而不是JavaScript文件

JSX只不过是带有不同扩展名的Javascript。Facebook提出了这个新的扩展，以便与JavaScript中类似xml的HTML实现区分开来。

JSX是一种可嵌入的类似xml的语法。它将被转换成有效的JavaScript。JSX随着React框架而流行起来。TypeScript支持嵌入、类型检查和直接将JSX编译成JavaScript。

要使用JSX，我们必须做两件事。

使用.tsx扩展名命名文件
启用jsx选项

匿名函数是声明时没有任何命名标识符的函数。这些函数是在运行时动态声明的。与标准函数一样，匿名函数可以接受输入和返回输出。匿名函数在初始创建之后通常是不可访问的。

例子

let myAdd = function(x: number, y: number): number {
return x + y;
};
console.log(myAdd())

如果子类(子类)具有与父类中声明的相同的方法，则称为方法覆盖。换句话说，在派生类或子类中重新定义基类方法。

方法重写的规则

该方法必须具有与父类相同的名称
该方法必须具有与父类相同的参数。
必须有一个IS-A关系(继承)。
例子

class NewPrinter extends Printer {
doPrint(): any {
super.doPrint();
console.log("Called Child class.");
}
doInkJetPrint(): any {
console.log("Called doInkJetPrint().");
}
}
let printer: new () => NewPrinter;
printer.doPrint();
printer.doInkJetPrint();

在实际的TypeScript开发中，常常会用到第三方工具库。以下是几个常用工具库及其应用。

1、lodash
lodash是一个实用的JavaScript工具库，提供了很多常用函数的封装，可以提升JavaScript的开发效率。
import * as _ from "lodash";
let arr = [1, 2, 3, 4, 5];
let chunkedArr = _.chunk(arr, 2);
console.log(chunkedArr); // 输出[[1, 2], [3, 4], [5]]
2、axios
axios是一个基于Promise的HTTP客户端，可用于浏览器和Node.js环境中的HTTP请求。
import axios from "axios";
axios.get("https://api.github.com/users/octocat").then(response => {
console.log(response.data);
});

3、moment
moment是一个常用的日期处理工具库，提供了强大的日期格式化和计算功能。
import moment from "moment";
let date = moment("2021-01-01");
console.log(date.format("YYYY年MM月DD日")); // 输出2021年01月01日
console.log(date.add(1, "year").format("YYYY年MM月DD日")); // 输出2022年01月01日