【面试宝典】74道TypeScript高频题库整理(附答案背诵版)

原创

于 2024-08-06 22:05:45 发布 · 4.7k 阅读

19 ·

CC 4.0 BY-SA版权

文章标签：

#面试 #typescript #职场和发展

1.简述什么是TypeScript ？

TypeScript是一种由Microsoft开发和维护的开源编程语言。它是JavaScript的一个超集，意味着它扩展了JavaScript的功能，包括添加了类型系统和对ES6+的新特性的支持。TypeScript的设计目标是帮助开发者捕捉代码中的错误，通过在编译阶段进行类型检查来实现这一点。这可以提高代码的质量和可维护性，特别是在开发大型的或者是多人协作的项目时。

TypeScript的核心优势之一是它的可选静态类型系统。开发者可以为变量、函数的参数、返回值等声明类型，但这并不是强制的。这意味着你可以逐步地将一个JavaScript项目迁移到TypeScript，而不需要一开始就重写所有东西。此外，TypeScript的类型系统是非常强大和灵活的，支持包括基础类型（如字符串、数字和布尔值）、枚举、接口、类、数组、元组以及联合类型和交叉类型等高级类型。

下面是一个简单的TypeScript示例，展示了如何声明变量的类型：

let isCompleted: boolean = false; // 声明一个布尔类型的变量

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

greet("Alice"); // 正确
greet(42); // 错误，TypeScript编译时会报错，因为42不是一个字符串

在这个例子中，我们定义了一个布尔类型的变量isCompleted和一个接受字符串参数的函数greet。如果尝试用非字符串类型的参数调用greet函数，TypeScript编译器将会提示类型错误。这就是TypeScript如何帮助开发者在代码运行之前就捕捉到潜在的错误。

2.简述TypeScript 的主要特点是什么？

TypeScript的主要特点可以总结如下：

可选的静态类型系统：TypeScript的核心特性之一是它的静态类型系统，这对于捕捉常见的编程错误非常有帮助。类型是可选的，意味着你可以决定是否为变量、函数参数等指定类型。这使得从JavaScript过渡到TypeScript更加容易和灵活。
类型推断：即使你不显式声明类型，TypeScript也能根据上下文自动推断出变量或表达式的类型。这减少了需要显式声明类型的情况，同时仍然提供了类型安全的好处。
支持最新的JavaScript特性：TypeScript支持ECMAScript标准的最新特性，这意味着你可以使用最新的JavaScript语法和特性编写代码，然后TypeScript编译器会将其转换成兼容旧版本JavaScript引擎的代码。
跨平台和跨浏览器兼容性：通过将TypeScript代码编译为普通的JavaScript，生成的代码可以在任何支持JavaScript的平台上运行，无论是浏览器还是Node.js环境。
强大的工具支持：TypeScript提供了强大的开发工具支持，包括自动完成、类型检查和重构等功能，这些都能在开发过程中提高生产力和代码质量。这些工具支持在流行的IDE和编辑器中都有很好的集成，如Visual Studio Code。
易于集成：你可以逐渐将TypeScript集成到现有的JavaScript项目中，而不是一开始就全面转换。这是因为TypeScript是JavaScript的超集，所以现有的JavaScript代码可以直接在TypeScript项目中使用。
丰富的社区和生态系统：由于Microsoft和许多其他组织和开发者的积极参与，TypeScript拥有一个非常活跃的社区和丰富的生态系统。这意味着有大量的类型定义、工具和库可供使用，能够帮助你快速开发应用。

举个例子，如果你正在使用一个流行的JavaScript库，很可能已经有人为该库编写了TypeScript的类型定义文件（.d.ts文件），这样你就可以在TypeScript项目中享受到自动完成和类型检查等特性，而不需要自己从头写类型声明。

3.简述TypeScript 有什么好处？

TypeScript为开发者提供了多种好处，尤其是在构建大型或复杂的JavaScript应用时。以下是TypeScript的一些主要优点：

静态类型检查：TypeScript的最显著特点是它的静态类型系统。通过在开发阶段引入类型检查，TypeScript帮助开发者发现并修正错误，这些错误在纯JavaScript项目中可能直到运行时才会暴露。静态类型检查可以提升代码质量，减少潜在的运行时错误。
代码自动补全和智能感知：类型系统不仅帮助捕获错误，还能提高开发效率。大多数现代IDE和代码编辑器可以利用TypeScript提供的类型信息，提供更好的代码自动完成、函数签名提示等智能感知功能。
更好的重构支持：类型信息使得重构代码更加安全和容易。当你重命名一个类或函数时，TypeScript可以帮助确保项目中所有的引用都被更新，减少了手动查找和替换引起的错误。
允许使用最新的JavaScript特性：TypeScript支持最新的ECMAScript标准，允许你使用最新的JavaScript特性，比如async/await、箭头函数等。TypeScript编译器会将这些现代特性转换成向下兼容的JavaScript代码，确保你的应用可以在老旧的浏览器上运行。
适合大型项目：随着JavaScript项目的增长，维护和管理其复杂性变得更加困难。TypeScript的类型系统和编译时检查使得开发大型应用更加可管理和可维护。
社区支持和生态系统：TypeScript拥有一个活跃的社区和丰富的生态系统。许多流行的JavaScript库和框架都提供了TypeScript的类型定义，使得它们能够无缝集成到TypeScript项目中。
渐进式迁移：你可以逐步将现有的JavaScript项目迁移到TypeScript，这为项目提供了灵活性。TypeScript允许你一次迁移一个文件，同时保持项目的其余部分为纯JavaScript。

总的来说，TypeScript提供的静态类型检查、工具支持和对最新JavaScript特性的支持，使得开发大型和复杂的应用变得更加高效和可靠。这些好处使得TypeScript成为许多企业和开发者构建应用程序时的首选语言。

4.TypeScript 的内置数据类型有哪些？

TypeScript提供了多种内置数据类型，以帮助开发者定义变量的类型，这些类型包括：

Boolean：布尔值类型，用于表示逻辑上的真(true)或假(false)。
```
let isDone: boolean = false;
```
Number：数字类型，所有的数字，包括整数和浮点数，都用Number类型表示，支持十进制、十六进制、二进制和八进制字面量。
```
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;
```
String：字符串类型，用于表示文本数据。可以使用双引号(" ")、单引号(' ')或者模板字符串(``)来定义字符串值。
```
let color: string = "blue";
color = 'red';
let fullName: string = `Bob Bobbington`;
```
Array：数组类型，可以在元素类型后面使用[]来表示变量是该类型的数组，或者使用泛型数组类型Array<元素类型>。
```
let list: number[] = [1, 2, 3];
let listGeneric: Array<number> = [1, 2, 3];
```
Tuple：元组类型，允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。
```
let x: [string, number];
x = ["hello", 10]; // 正确
```
Enum：枚举类型，用于定义一组命名的常数。TypeScript的枚举可以是数字或字符串枚举。
```
enum Color {
     
     Red, Green, Blue}
let c: Color = Color.Green;
```
Any：任意类型，允许赋值为任意类型的值，是一种逃避类型检查的方法。
```
let notSure: any = 4;
notSure = "maybe a string instead";
```

Void：用于标识没有任何类型，通常用在没有返回值的函数的返回类型上。

function warnUser(): void {
     
     
    console.log("This is my warning message");
}

Null 和 Undefined：TypeScript里，null和undefined有各自的类型名为null和undefined。默认情况下，它们是所有类型的子类型，就是说你可以将null和undefined赋值给比如number类型的变量。
```
let u: undefined = undefined;
let n: null = null;
```
Never：表示那些永不存在的值的类型，例如，never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回类型。
```
function error(message: string): never {
     
     
    throw new Error(message);
}
```
Object：表示非原始类型，即除number，string，boolean，symbol，null或undefined之外的类型。
```
declare function create(o: object | null): void;
```