一、【typescript】必须要掌握的概念、常见TS面试题

1.什么是 TypeScript，它与 JavaScript 有何不同？提供 TypeScript 代码示例。

答案：TypeScript 是 JavaScript 的超集，为该语言添加了静态类型。它允许开发人员定义变量、函数参数和返回值的数据类型，这有助于在编译时而不是运行时捕获错误。

2.解释 TypeScript 中静态类型的概念及其好处。

答案：TypeScript 中的静态类型可以在开发过程中指定变量、函数参数和返回值的数据类型。这有助于及早捕获与类型相关的错误，从而提高代码质量和可维护性。

好处是拥有更好的代码文档、增强的工具支持以及提高的开发人员生产力。

3.TypeScript 中的接口是什么？举个例子。

答案：TypeScript 中的接口定义了对象结构的契约，指定其属性和方法的名称和类型。它们促进强大的类型检查并实现更好的代码组织。这是一个例子：

interface Person {
  name: string;
  age: number;
}
function greet(person: Person): string {
  return Hello, ${person.name}! You are ${person.age} years old.;
}
const john: Person = { name: 'John', age: 30 };
const message: string = greet(john);
console.log(message); // Output: "Hello, John! You are 30 years old."

4.使用 TypeScript 相对于纯 JavaScript 有什么好处？

答：TypeScript 提供了多种好处，包括静态类型、更好的代码分析和工具支持、改进的代码可读性、早期错误检测、更轻松的代码重构以及增强的代码文档。它还使开发人员能够编写更易于维护和扩展的应用程序。

5.如何在 TypeScript 的接口中定义可选属性？举个例子。

答案：您可以使用 ? 在接口中定义可选属性。属性名称后面的修饰符。可选属性可能存在于实现该接口的对象中，也可能不存在。这是一个例子：

interface Person {
  name: string;
  age?: number;
}
const john: Person = { name: 'John' };
const jane: Person = { name: 'Jane', age: 25 };

6.解释 TypeScript 中联合类型的概念并提供示例。

答：联合类型允许一个变量有多种类型。它通过使用 | 来表示类型之间的符号。这允许变量存储任何指定类型的值。这是一个例子：

function printId(id: number | string): void {
  console.log(ID: ${id});
}

7.TypeScript 中的类型断言是什么？举个例子。

答案：当无法自动推断类型时，TypeScript 中的类型断言允许您显式告诉编译器变量的类型。这是使用 或 as type 语法实现的。这是一个例子：

let length: any = '5';
let numberLength: number = length; // Using  syntax 
let stringLength: number = length as number; // 

8.如何在 TypeScript 中定义具有可选参数和默认参数的函数？举个例子。

答案：您可以使用 ? 定义带有可选参数和默认参数的函数。可选参数的修饰符以及为参数分配默认值。这是一个例子：

function greet(name: string, message: string = 'Hello', times?: number): void {
  for (let i = 0; i < (times || 1); i++) {
    console.log(${message}, ${name}!);
  }
}
greet('John'); // Output: "Hello, John!"
greet('Jane', 'Hi'); // Output: "Hi, Jane!"
greet('Tom', 'Hey', 3); // Output: "Hey, Tom!", "Hey, Tom!", "Hey, Tom!"

9.TypeScript 中的泛型是什么？举个例子。

答案：TypeScript 中的泛型允许您创建可与各种类型一起使用的可重用组件或函数。它们支持强类型，同时保持使用不同数据类型的灵活性。这是一个例子：

function identity(arg: T): T {   return arg; } 
const result1 = identity(42); // Explicitly specifying the type 
const result2 = identity('hello'); // Inferring the type 

10.通过示例解释 TypeScript 中的“keyof”关键字。

答案：TypeScript 中的“keyof”关键字是一个类型运算符，它返回表示对象键的文字类型的联合。它允许您对对象键执行类型安全操作。这是一个例子：

interface Person {
  name: string;
  age: number;
}
type PersonKeys = keyof Person; // "name" | "age"

11.TypeScript 中的类型保护是什么？它们如何工作？举个例子。

答案：类型防护是 TypeScript 表达式，它在运行时检查变量的类型，并允许您根据类型执行不同的操作。它们可以实现更好的类型推断，并提供一种更有效地处理联合类型的方法。

这是使用 typeof 和 instanceof 类型保护的示例：

function printValue(value: string | number): void {
  if (typeof value === 'string') {
    console.log(The value is a string: ${value});
  } else if (typeof value === 'number') {
    console.log(The value is a number: ${value});
  }
}
class Person {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}
function greet(person: Person | string): void {
  if (person instanceof Person) {
    console.log(Hello, ${person.name}!);
  } else if (typeof person === 'string') {
    console.log(Hello, ${person}!);
  }
}
const stringValue: string = 'Hello';
const numberValue: number = 42;
printValue(stringValue); // Output: "The value is a string: Hello"
printValue(numberValue); // Output: "The value is a number: 42"
const john: Person = new Person('John');
greet(john); // Output: "Hello, John!"
greet('Jane'); // Output: "Hello, Jane!"

12.解释 TypeScript 中条件类型的概念。举个例子。

答案：TypeScript 中的条件类型允许您创建依赖于条件的类型。它们用于根据类型之间的关系执行类型推断。这是一个例子：

type ReturnType = T extends (...args: any[]) => infer R ? R : never; 
function add(a: number, b: number): number {   
  return a + b; 
} 
type AddReturnType = ReturnType; 
// number 在此示例中，
// ReturnType 是推断函数返回类型的条件类型。

13.TypeScript 中的映射类型是什么？举个例子。

答案：TypeScript 中的映射类型允许您通过将属性映射到新类型来基于现有类型创建新类型。它们使您能够轻松修改现有类型或向现有类型添加属性。这是一个例子：

interface Person {
  name: string;
  age: number;
}
type PersonWithOptionalProperties = { [K in keyof Person]?: Person[K] };
const john: Person = { name: 'John', age: 30 };
const johnWithOptionalProperties: PersonWithOptionalProperties = { name: 'John' };

在此示例中，PersonWithOptionalProperties 是一个映射类型，它使 Person 的所有属性都是可选的。

14.解释 TypeScript 中的“部分”实用程序类型。举个例子。

答案：TypeScript 中的“部分”实用程序类型用于使现有类型的所有属性成为可选。它允许您从现有类型创建具有可选属性的新类型。这是一个例子：

interface Person {
  name: string;
  age: number;
}
type PartialPerson = Partial; 
const john: PartialPerson = { name: 'John' }; 

在此示例中，PartialPerson 是具有来自 Person 接口的可选属性的类型。

15.TypeScript 中的“只读”实用程序类型是什么？它是如何工作的？举个例子。

答案：TypeScript 中的“Readonly”实用程序类型用于使现有类型的所有属性变为只读。它可以防止对象创建后修改其属性。这是一个例子：

interface Person {
  readonly name: string;
  age: number;
}