Typescript基础面试题 | 03.精选 ts 面试题

在这里插入图片描述

🤍 前端开发工程师（主业）、技术博主（副业）、已过CET6
🍨 阿珊和她的猫_CSDN个人主页
🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》
🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程《Vue.js 和 Egg.js 开发企业级健康管理项目》、《带你从入门到实战全面掌握 uni-app》

文章目录

- 9. 什么是泛型？如何使用泛型？
- 10. 什么是类型 inference？它在 TypeScript 中的作用是什么？
- 11. 如何使用模块？为什么需要使用模块？
- 12. 如何使用命名空间？

9. 什么是泛型？如何使用泛型？

在 TypeScript 中，泛型是一种允许您在不指定具体类型的情况下编写通用代码的机制。泛型允许您创建可以接受多种不同类型作为参数的函数、类和接口。

要使用泛型，您可以在函数、类或接口的声明中使用<T>或<typename>来指定一个占位符类型参数。然后，您可以在函数、类或接口的定义中使用该类型参数来表示任何类型。

下面是一个使用泛型的示例：

function createArray<T>(length: number): T[] {
    return new Array(length);
}

const numbers = createArray<Number>(5);
const strings = createArray<String>(5);

在上述示例中，我们定义了一个名为createArray的函数，它接受一个类型参数T和一个数字参数length。该函数返回一个包含指定长度的T类型元素的数组。

然后，我们创建了两个变量numbers和strings，分别使用createArray<Number>和createArray<String>来创建包含 5 个数字和 5 个字符串的数组。

泛型的使用使得代码更加通用和灵活，因为它允许您编写可以处理多种不同类型的函数、类和接口，而无需为每种类型编写重复的代码。

10. 什么是类型 inference？它在 TypeScript 中的作用是什么？

在 TypeScript 中，类型 inference 是一种机制，用于根据变量的初始化值或函数的参数类型自动推断变量或函数的类型。

类型 inference 使得您无需显式地指定变量或函数的类型，因为 TypeScript 可以根据上下文自动推断它们的类型。

下面是一个使用类型 inference 的示例：

let name = "Alice"; // 类型被推断为 string
let age = 25; // 类型被推断为 number
let isAdult = true; // 类型被推断为 boolean

function sayHello(person: { name: string, age: number }) {
    console.log(`Hello, my name is ${person.name} and I am ${person.age} years old.`);
}

sayHello({ name: "Bob", age: 30 });

在上述示例中，TypeScript 可以根据变量的初始化值自动推断它们的类型。例如，变量name被初始化为字符串"Alice"，因此它的类型被推断为string。同样，变量age被初始化为数字 25，因此它的类型被推断为number。

在函数sayHello中，我们没有显式地指定参数person的类型，但是 TypeScript 可以根据传入的实际参数自动推断它的类型。在上述示例中，函数sayHello被调用时传递了一个包含name和age属性的对象，因此person的类型被推断为{ name: string, age: number }。

类型 inference 可以提高代码的可读性和可维护性，因为它减少了不必要的类型注解，并使代码更加简洁和直观。但是，在某些情况下，您可能需要显式地指定变量或函数的类型，以确保代码的正确性和可读性。

11. 如何使用模块？为什么需要使用模块？

在 TypeScript 中，模块是一种组织代码的方式，它允许您将代码划分为独立的单元，并在不同的文件中分别定义和使用它们。

要使用模块，您可以使用import和export关键字。import关键字用于从其他模块中导入代码，而export关键字用于将代码从当前模块中导出，以便其他模块可以使用它。

下面是一个使用模块的示例：

// 文件: module.ts
export function multiply(a: number, b: number): number {
    return a * b;
}

// 文件: app.ts
import { multiply } from "./module";

console.log(multiply(5, 10));  // 输出: 50

在上述示例中，我们在module.ts文件中定义了一个名为multiply的函数，并使用export关键字将其导出。

然后，在app.ts文件中，我们使用import { multiply } from "./module";语句从module.ts文件中导入multiply函数，并将其赋值给本地变量multiply。

最后，我们调用multiply函数并传递参数 5 和 10，输出结果为 50。

使用模块的主要原因是提高代码的可读性、可维护性和可重用性。通过将代码划分为独立的模块，您可以更好地组织代码结构，减少命名冲突，并更方便地管理和维护代码。

此外，模块还可以提高代码的可测试性，因为您可以在不同的文件中分别测试每个模块，而无需在单个文件中包含所有的代码。

12. 如何使用命名空间？

在 TypeScript 中，命名空间是一种组织代码的方式，它允许您将相关的代码和类型分组到一个命名空间中，并在代码中通过命名空间来访问它们。

要使用命名空间，您可以使用namespace关键字来定义一个命名空间，并使用export关键字来将命名空间中的内容导出。

下面是一个使用命名空间的示例：

// 文件: namespace.ts
namespace MyNamespace {
    export function multiply(a: number, b: number): number {
        return a * b;
    }
}

// 文件: app.ts
import { multiply } from "./namespace";

console.log(multiply(5, 10));  // 输出: 50