前端面试热点题目——typescript篇

server/2024/9/23 11:59:42/

在TypeScript面试中,面试官通常会考察你对TypeScript特性的理解、类型系统的掌握、以及在实际项目中的应用能力。以下是一些热点题目及其相应的代码示例,旨在帮助你准备TypeScript相关的面试。

1. 类型别名与接口的区别及使用场景

问题:请解释类型别名(Type Aliases)和接口(Interfaces)之间的主要区别,并给出使用场景。

答案

  • 类型别名:用于给类型起一个新名字,可以是基本类型、联合类型、交叉类型、数组类型等。它更灵活,但不能被extends或implements(仅当类型别名是对象或类类型时,可以用在extends或implements的右侧)。
  • 接口:主要用于定义对象的形状,它可以包含方法(抽象或具体)、属性等。接口可以被extends和implements。

代码示例

// 类型别名  
type Name = string;  
type UserInfo = {  name: Name;  age: number;  
};  // 接口  
interface IPerson {  name: string;  greet(phrase: string): void;  
}  class Person implements IPerson {  name: string;  constructor(name: string) {  this.name = name;  }  greet(phrase: string) {  console.log(`${phrase}, ${this.name}!`);  }  
}  // 使用场景:当你需要一个简单的类型引用时,使用类型别名;当需要定义对象形状或继承时,使用接口。

2. 泛型(Generics)的使用

问题:请解释什么是泛型,并给出一个使用泛型的函数示例。

答案:泛型是一种在编译时定义类型但在运行时保持灵活性的方法。它允许你编写灵活、可重用的函数、类或接口。

代码示例

// 泛型函数示例  
function identity<T>(arg: T): T {  return arg;  
}  let output = identity<string>("myString");  // 类型参数为string  
let outputNum = identity(42);               // 类型参数为number,TypeScript会自动推断  // 泛型接口示例  
interface GenericIdentityFn<T> {  (arg: T): T;  
}  let myIdentity: GenericIdentityFn<number> = identity;

3. 枚举(Enumerations)与常量(Constants)的区别

问题:请阐述枚举(Enumerations)与常量(Constants)之间的主要区别。

答案

  • 枚举:是一种特殊的类,它包含了一组命名的常量。枚举成员可以是数字、字符串甚至是计算值(只要成员之间有明确的差异)。枚举提供了一种描述一组命名常量的方法,使得代码更加清晰。
  • 常量:通常使用const关键字定义,表示其值在初始化之后不可更改。它可以是任何类型。

代码示例

enum Color {Red, Green, Blue};  
let c: Color = Color.Green;  const PI = 3.14;  
// PI = 3.15; // 这会引发编译错误

4. TypeScript中类属性的初始化时机

问题:在TypeScript中,类属性的初始化时机是怎样的?

答案

  • 类属性可以在声明时直接初始化(称为实例属性初始化器)。
  • 也可以在构造函数中初始化。
  • 如果类属性是静态的,则它可以在类体内部直接初始化。

代码示例

class Person {  // 实例属性初始化器  name: string = "John";  age: number;  // 静态属性  static staticProperty = "I am static";  constructor(age: number) {  this.age = age;  }  
}  console.log(new Person(30).name); // John  
console.log(Person.staticProperty); // I am static

5.解释一下 TypeScript 中的 interface 和 type 有什么区别?

答案概述

  • interface 通常用于定义对象的形状,可以被多次声明并合并,支持继承其他接口。
  • type 更为灵活,支持联合类型、元组、字面量类型等复杂类型,但不能被多次声明(除非使用类型别名)。

示例代码

// Interface 示例  
interface User {  name: string;  age: number;  
}  interface UserWithEmail extends User {  email: string;  
}  const user: UserWithEmail = {  name: 'John Doe',  age: 30,  email: 'john@example.com'  
};  // Type 示例  
type Name = string;  
type Age = number;  
type UserType = {  name: Name;  age: Age;  email?: string; // 可选属性  
};  const anotherUser: UserType = {  name: 'Jane Doe',  age: 25  
};

4. TypeScript 中如何声明一个模块?

答案概述
在 TypeScript 中,模块是用来封装变量、函数、类、接口等对象的容器。

示例代码

math.ts

export function add(a: number, b: number): number {  return a + b;  
}  export function subtract(a: number, b: number): number {  return a - b;  
}

main.ts

import { add, subtract } from './math';  console.log(add(1, 2)); // 输出 3  
console.log(subtract(5, 3)); // 输出 2

http://www.ppmy.cn/server/116255.html

相关文章

超详细超实用!!!零基础java开发之云风笔记笔记列表接口开发(七)

云风网 云风笔记 云风知识库 云风笔记的登录注册接口开发完成之后&#xff0c;我们接下来可以开始进行笔记的添加接口以及笔记列表展示接口的开发 一、新建包note、实体类NoteManage 添加笔记所需要的字段属性主要有&#xff1a; 笔记名称&#xff1a;name笔记分类&#xff1…

Centos使用阿里云镜像安装docker及docker hub下载失败解决方案

一 配置阿里云的Yum镜像源 配置阿里云的Yum镜像源可以提高下载速度&#xff0c;尤其是在国内网络环境下。以下是配置阿里云Yum镜像源的步骤&#xff1a; 1. 备份原有的Yum源配置文件 首先&#xff0c;备份系统现有的Yum源配置文件&#xff0c;以防出现问题时可以还原&#x…

鸿蒙轻内核M核源码分析系列十二 事件Event

往期知识点记录&#xff1a; 鸿蒙&#xff08;HarmonyOS&#xff09;应用层开发&#xff08;北向&#xff09;知识点汇总 轻内核M核源码分析系列一 数据结构-双向循环链表 轻内核M核源码分析系列二 数据结构-任务就绪队列 鸿蒙轻内核M核源码分析系列三 数据结构-任务排序链表 轻…

《中外食品工业》是什么级别的期刊?是正规期刊吗?能评职称吗?

​问题解答 问&#xff1a;《中外食品工业》是不是核心期刊&#xff1f; 答&#xff1a;不是&#xff0c;是知网收录的正规学术期刊。 问&#xff1a;《中外食品工业》级别&#xff1f; 答&#xff1a;国家级。主管单位&#xff1a; 中国轻工业联合会 …

手机玩机常识-------诺基亚系列机型3/5/6/7/8详细的刷机教程步骤 手机参考救砖刷机教程

诺基亚手机 诺基亚&#xff08;Nokia Corporation&#xff09;&#xff0c;成立于1865年&#xff0c;是一家主要从事移动通信设备生产和相关服务的手机公司 &#xff0c;总部位于芬兰埃斯波 。从1996年开始&#xff0c;诺基亚手机连续15年占据手机市场份额第一位置&…

LeetCode之二叉搜索树

530. 二叉搜索树的最小绝对差 /*** Definition for a binary tree node.* public class TreeNode {* int val;* TreeNode left;* TreeNode right;* TreeNode() {}* TreeNode(int val) { this.val val; }* TreeNode(int val, TreeNode left, TreeNode…

Linux TCP服务器和客户端学习

socket 这里实现的是单连接的情况&#xff0c;即一个服务器只能连接一个客户端。实现的功能是 服务器端&#xff1a;等待客户端连接&#xff0c;连接后显示客户端发送的数据&#xff0c;并将数据原样发送给客户端。 客户端&#xff1a;连接服务器&#xff0c;然后向服务器发送…

ubuntu24.04 为什么扬声器没有声音,但是戴上耳机有声音

扬声器在 Ubuntu 24.04 下没有声音&#xff0c;但耳机有声音&#xff0c;可能是由于以下几个原因造成的&#xff1a; 1. 输出设备设置问题 系统可能将默认输出设备设置为耳机&#xff0c;而非扬声器。你可以检查或更改音频输出设备&#xff1a; 打开“设置” -> “声音”…