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

news2024/11/27 18:36:12

在这里插入图片描述

🤍 前端开发工程师(主业)、技术博主(副业)、已过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类型元素的数组。

然后,我们创建了两个变量numbersstrings,分别使用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被调用时传递了一个包含nameage属性的对象,因此person的类型被推断为{ name: string, age: number }

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

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

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

要使用模块,您可以使用importexport关键字。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

在上述示例中,我们在namespace.ts文件中定义了一个名为MyNamespace的命名空间,并在该命名空间中定义了一个名为multiply的函数。

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

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

使用命名空间的主要原因是提高代码的可读性和可维护性。通过将相关的代码和类型分组到一个命名空间中,您可以更好地组织代码结构,减少命名冲突,并更方便地管理和维护代码。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1254610.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

C# WPF上位机开发(开篇)

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 之前很少用到c#语言&#xff0c;大部分时间都用c/c&#xff0c;主要是它可以兼顾上位机qt开发以及嵌入式开发。所以&#xff0c;用c/c是比较合理的…

新手如何买卖股票,股票投资基础入门

一、教程描述 本套股票教程&#xff0c;大小3.89G&#xff0c;共有13个文件。 二、教程目录 第01课【极速入门】股市全景.mp4 第02课【极速入门】入门实操.mp4 第03课【价值分析】白马选股.mp4 第04课【价值分析】行业选股.mp4 第05课【价值分析】量化选股.mp4 第06课【…

vue3+ts 依赖注入 provide inject

父级&#xff1a; <template><div><h1>App.vue (爷爷级别)</h1><label><input type"radio" v-model"colorVal" value"red" name"color" />红色</label><label><input type"r…

leetCode 1080.根到叶路径上的不足节点 + 递归 + 图解

给你二叉树的根节点 root 和一个整数 limit &#xff0c;请你同时删除树中所有 不足节点 &#xff0c;并返回最终二叉树的根节点。假如通过节点 node 的每种可能的 “根-叶” 路径上值的总和全都小于给定的 limit&#xff0c;则该节点被称之为 不足节点 &#xff0c;需要被删除…

养生馆服务预约会员管理系统小程序效果如何

中医养生馆的全国数量逐渐增加&#xff0c;各种疾病困扰下&#xff0c;有些病往往通过养生馆即可治好&#xff0c;比如常见的针灸、按摩、药理滋补、切脉等&#xff0c;都有很高的市场需求度&#xff0c;而随着众多商家入局赛道及消费升级&#xff0c;传统中医养生馆经营痛点也…

【C++】哈希(位图、布隆过滤器)

一、哈希的应用&#xff08;位图和布隆过滤器&#xff09; 1、位图&#xff08;bitset&#xff09; &#xff08;1&#xff09;位图概念 【题目】 给 40亿 个不重复的无符号整数&#xff0c;没排过序。给一个无符号整数&#xff0c;如何快速判断一个数是否在这 40亿 个数中。…

电源的纹波

电源纹波的产生 我们常见的电源有线性电源和开关电源&#xff0c;它们输出的直流电压是由交流电压经整流、滤波、稳压后得到的。由于滤波不干净&#xff0c;直流电平之上就会附着包含周期性与随机性成分的杂波信号&#xff0c;这就产生了纹波。 在额定输出电压、电流的情况下…

Shell脚本:Linux Shell脚本学习指南(第三部分Shell高级)二

七、Shell Here String&#xff08;内嵌字符串&#xff0c;嵌入式字符串&#xff09; Here String 是《六、Shell Here Document&#xff08;内嵌文档/立即文档&#xff09;》的一个变种&#xff0c;它的用法如下&#xff1a; command <<< string command 是 Shell 命…

指定训练使用的GPU个数,没有指定定gpu id,训练在其中两个gpu上执行,但是线程id分布在所有4个gpu上,为什么?如何解决?

目录 问题背景 1 线程id分布在所有gpu&#xff08;包括未启用的gpu&#xff09;上原因&#xff1a; 2 在解决这个问题时&#xff0c;可以采取以下步骤&#xff1a; 3 修正深度学习框架默认使用所有可见 GPU 的问题 1 TensorFlow&#xff1a; 2 PyTorch&#xff1a; 3 K…

【【Linux编程介绍之关键配置和常用用法】】

Linux编程介绍之关键配置和常用用法 Hello World ! 我们所说的编写代码包括两部分&#xff1a;代码编写和编译&#xff0c;在Windows下可以使用Visual Studio来完成这两部&#xff0c;可以在 Visual Studio 下编写代码然后直接点击编译就可以了。但是在 Linux 下这两部分是分开…

13年老鸟总结,性能测试方法汇总+性能响应很慢排查方法(详全)

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 1、性能测试包含哪…

智能优化算法应用:基于麻雀算法无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于麻雀算法无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于麻雀算法无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.麻雀算法4.实验参数设定5.算法结果6.参考文献7.MATLAB…

火锅店管理系统外卖点餐配送小程序的效果

火锅是餐饮行业重要的组成部分&#xff0c;在每个地方都受到追捧&#xff0c;其从业商家众多&#xff0c;头部连锁品牌也不少&#xff0c;近些年行业市场规模也一直增加&#xff0c;而随着消费升级及数字化转型&#xff0c;传统火锅店经营痛点不少&#xff1a; 火锅店的需求非…

Unsupervised MVS论文笔记(2019年)

Unsupervised MVS论文笔记&#xff08;2019年&#xff09; 摘要1 引言2 相关工作3 实现方法3.1 网络架构3.2 通过光度一致性学习3.3 MVS的鲁棒光度一致性3.4 学习设置和实施的细节3.5.预测每幅图像的深度图 4 实验4.1 在DTU上的结果4.2 消融实验4.3 在ETH3D数据集上的微调4.4 在…

三轴加速度计LIS2DW12开发(1)----轮询获取加速度数据

STM32WB55开发.6--FUS更新 概述视频教学通信模式管脚定义IIC通信模式速率生成STM32CUBEMX串口配置IIC配置CS和SA0设置串口重定向参考程序初始换管脚获取ID复位操作BDU设置设置传感器的量程配置过滤器链配置电源模式设置输出数据速率轮询获取加速度演示 概述 本文将介绍如何驱…

智能优化算法应用:基于粒子群算法无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于粒子群算法无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于粒子群算法无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.粒子群算法4.实验参数设定5.算法结果6.参考文献7.…

烧烤店点餐外卖配送管理小程序作用如何

烧烤是人们爱吃的食品之一&#xff0c;尤其到了晚上商业小吃街&#xff0c;烧烤店里往往是坐满了人&#xff0c;甚至还有排队的&#xff0c;从业商家众多&#xff0c;足可见该餐饮细分领域在市场中的欢迎程度。 而在实际经营中&#xff0c;烧烤店经营痛点也不小。 随着互联网…

注意力机制(Attention Mechanism)

目录 1. 简介&#xff1a;探索注意力机制的世界 2. 历史背景 3. 核心原理 4. 应用案例 5. 技术挑战与未来趋势 6. 图表和示例 7. Conclusion 1. 简介&#xff1a;探索注意力机制的世界 在当今的人工智能&#xff08;AI&#xff09;和机器学习&#xff08;ML&#xff09;…

Linux内核--内存管理(一)任务空间管理

目录 一、引言 二、基本概念梳理 三、用户态进程内存管理 ------>3.1、用户态 ------>3.2、内核态 ------>3.3、内存管理结构 ------>3.4、mm_struct ------>4.5、vm_area_struct 四、内核态结构 ------>4.1、32位内核态结构 ------>4.2、64位…

vue3+ts 兄弟组件之间传值

父级&#xff1a; <template><div><!-- <A on-click"getFlag"></A><B :flag"Flag"></B> --><A></A><B></B></div> </template><script setup lang"ts"> i…