”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 【面试精要】常见TypeScript面试题

【面试精要】常见TypeScript面试题

发布于2024-11-01
浏览:339

【Interview Essentials】ommon TypeScript Interview Questions

github:https://github.com/Jessie-jzn
网站:https://www.jessieontheroad.com/

1. 为什么使用 TypeScript?

1。静态类型检查

TypeScript 的核心优势是其静态类型检查,这有助于在编译阶段而不是运行时捕获常见错误。这增强了代码的可靠性和稳定性。

2.增强的代码编辑体验

TypeScript 的类型系统可以在编辑器中实现更准确的代码补全、重构、导航和文档功能,从而显着提高开发效率。

3.提高代码可维护性

类型声明使理解代码意图和结构变得更容易,这在团队开发环境中特别有益。

4。高级语言功能

TypeScript 支持 JavaScript 中不存在的高级功能,例如接口、枚举和泛型,有助于开发更加结构化和可扩展的代码。

5。更好的工具支持

TypeScript 提供了各种编译器选项来优化生成的 JavaScript 代码,并通过将 TypeScript 编译为兼容的 JavaScript 来支持不同的 JS 环境。

2. TypeScript 与 JavaScript

TypeScript JavaScript
类型系统 带有编译时类型检查的静态类型。可以为变量、函数参数和返回值指定类型。 带有运行时类型检查的动态类型,这可能会导致与类型相关的运行时错误。
类型注释 支持类型注释来显式定义类型。例如,让 name: string = "Alice"; 没有类型注释。类型在运行时确定。
汇编 需要编译为 JavaScript。 TypeScript 编译器检查类型错误并生成等效的 JavaScript 代码。 直接在浏览器或 Node.js 中运行,无需编译步骤。
面向对象编程 更丰富的 OOP 功能,例如类、接口、抽象类和访问修饰符。 具有基于原型的继承的基本 OOP 功能。
高级功能 包括所有 ES6 和 ES7 功能,以及泛型、枚举和装饰器等附加功能。 支持 ES6 及更高版本的标准,但缺少 TypeScript 提供的一些高级功能。

3. TypeScript 中的基本数据类型

  • 布尔值:代表真或假值。
  • 数字:表示整数和浮点数。
  • String:表示文本数据,使用单引号或双引号。
  • Array:表示指定类型的值的集合,使用type[]或Array.
  • 元组:表示一个包含固定数量指定类型元素的数组。
  • Enum:表示一组命名常量。
  • Any:表示任意类型的值。不提供类型检查。
  • Void:表示没有值,常用作不返回值的函数的返回类型。
  • Null 和 Undefined:分别表示没有值和未初始化状态。
  • Never:表示永远不会出现的值,例如抛出错误或无限期运行的函数。
  • Object:表示非原始类型。

4. TypeScript 中的泛型是什么?它们是如何使用的?

泛型允许函数、类和接口与任何类型一起使用,同时仍然强制执行类型安全。

例子:

function identity(arg: T): T {
  return arg;
}

const numberIdentity = identity(42);
const stringIdentity = identity("Hello");

在此示例中,恒等函数使用通用 ,允许它接受和返回任何类型的值。

5. TypeScript中unknown和any的区别

  • any Type:表示任意类型的值并绕过所有类型检查。它可以被赋予任何值,无需类型检查。
  • unknown Type:表示未知类型。未知类型的值在使用之前必须进行检查,这提供了一种更安全的方法来处理类型不确定的值。
let anyVar: any;
let unknownVar: unknown;

anyVar = 5;
anyVar.toUpperCase(); // No compile-time error, but might cause runtime error

unknownVar = "Hello";
if (typeof unknownVar === "string") {
  unknownVar.toUpperCase(); // Type check ensures safety
}

6. readonly修饰符与const关键字的区别

  • readonly 修饰符:用于对象属性,使其在初始化后不可变。
  • const 关键字:用于声明具有不可变引用的变量。对象的属性仍然可以修改。
const obj = { name: "John" };
obj.name = "Doe"; // Allowed

interface User {
  readonly id: number;
  name: string;
}

const user: User = { id: 1, name: "John" };
user.name = "Doe"; // Allowed
user.id = 2; // Error, `id` is readonly

7. TypeScript 中的装饰器

装饰器是一种特殊的 TypeScript 功能,允许添加元数据或修改类、方法、属性或参数。

类型:

  • 类装饰器:应用于类构造函数以修改类行为或添加元数据。
  • 方法装饰器:应用于方法以更改其行为或添加元数据。
  • 访问器装饰器:用于获取或设置访问器以修改其行为。
  • 属性装饰器:应用于类属性以添加元数据或修改其行为。
  • 参数装饰器:应用于方法参数以添加元数据。

示例:

  • 类装饰器:
function sealed(constructor: Function) {
  Object.seal(constructor);
  Object.seal(constructor.prototype);
}

@sealed
class Greeter {
  greeting: string;
  constructor(message: string) {
    this.greeting = message;
  }

  greet() {
    return `Hello, ${this.greeting}`;
  }
}

  • 方法装饰器:
function logMethod(target: any, propertyName: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  descriptor.value = function (...args: any[]) {
    console.log(`Method ${propertyName} called with args: ${JSON.stringify(args)}`);
    return originalMethod.apply(this, args);
  };
}

class Calculator {
  @logMethod
  add(a: number, b: number): number {
    return a   b;
  }
}

用法:

装饰器通过在 tsconfig.json 中将experimentalDecorators设置为 true 来启用。

8. 接口和类型的区别

interfacetype都是用来定义对象类型的,但是它们有一些区别:

界面 类型
基本用法 定义对象的形状,包括属性和方法。 定义基本类型、对象类型、联合类型、交集类型等
扩大 支持声明合并。同一接口的多个声明会自动合并。 不支持声明合并。
并集和交集类型 不支持。 支持联合(`
基本类型别名 不支持。 支持基本类型别名。
映射类型 不支持。 支持映射类型。
类实现 使用 Implements 支持类实现。 不支持直接类实现。

这些问题和答案应该涵盖基本概念和实际用法,有助于为 TypeScript 面试做好准备。

版本声明 本文转载于:https://dev.to/jessie_chen_4d333540e0c71/interview-essentials-8-common-typescript-interview-questions-4jki?1如有侵犯,请联系[email protected]删除
最新教程 更多>

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3