TS2023年面试题汇总~~~~持续更新中!!!!
文章目录
- 一、typescript 的数据类型有哪些
- 二、TypeScript 中枚举类型的理解
- 三、TypeScript 中接口的理解
- 四, TypeScript 中类的理解
- 五,TypeScript 中泛型的理解?
- 六,TypeScript 中高级类型的理解?
- 六,TypeScript 中type与interface区别
一、typescript 的数据类型有哪些
基本类型:number、string、boolean、null、undefined、symbol、bigint
数组类型:number[]、string[]、boolean[]、Array、Array、Array
元组类型:[number, string, boolean]
枚举类型:enum Color {Red, Green, Blue}
Any类型:any
Void类型:void
Object类型:object、Object
Never类型:never
二、TypeScript 中枚举类型的理解
枚举类型是 TypeScript 中的一种数据类型,它允许我们定义一些具名的常量集合
。使用枚举类型可以更加直观地表达代码含义,提高代码可读性和可维护性。
在 TypeScript 中,枚举类型通过enum
关键字进行定义。例如:
enum Direction {Up,Down,Left,Right
}
在这个例子中,我们定义了一个名为 Direction
的枚举类型,其中包含了四个常量成员:Up、Down、Left 和 Right。默认情况下,枚举成员的值会从0
开始自动编号,也可以手动指定值
三、TypeScript 中接口的理解
在 TypeScript 中,接口(Interface)是一种抽象的定义,用来描述对象的形状
。它定义了一个对象应该具有的属性和方法
。
接口的应用场景很广泛,例如在定义函数参数
时,可以使用接口来规范参数的类型和结构;在定义类
时,可以使用接口来规范类的结构;在定义复杂的对象
类型时,可以使用接口来提高代码的可读性和可维护性。
// 先定义一个接口
interface IUser {name: string;age: number;
}
const getUserInfo = (user: IUser): string => {return `name: ${user.name}, age: ${user.age}`;
};
// 正确的调用
getUserInfo({name: "koala", age: 18});
四, TypeScript 中类的理解
在 TypeScript 中,类是一种定义对象属性和方法的结构化方式
,使用 class
关键字来定义。
类可以包含属性和方法,通过实例化类可以创建对象,对象可以访问类中定义的属性和方法。
与 JavaScript 不同的是,TypeScript 中的类可以使用访问修饰符来控制属性和方法的访问级别,如 public(默认值,可以自由的访问类程序里定义的成员)
、private(只能够在该类的内部进行访问)
和 protected(除了在该类的内部可以访问,还可以在子类中仍然可以访问)
。
类也可以继承其他类,使用 extends
关键字来实现继承,从而可以复用已有的类定义。
类还可以实现接口,这种方式称为类实现接口,使用 implements
关键字来实现接口。
总的来说,类是面向对象编程的基本组成部分,可以通过类来创建具有一定属性和行为的对象,并且 TypeScript 中的类支持访问修饰符和继承等面向对象编程的概念,使得代码更加规范和易于维护。
五,TypeScript 中泛型的理解?
在 TypeScript 中,泛型可以让我们在定义函数、类、接口时不预先定义具体的类型,而是在使用时再指定类型。这使得代码更加灵活且可复用性更高。
以下是一些泛型的基本概念:
- 泛型函数:使用泛型来定义函数的参数和返回值类型。
function identity<T>(arg: T): T {return arg;
}
定义泛型的时候,可以一次定义多个类型参数,比如我们可以同时定义泛型 T 和 泛型 U:
- 泛型接口:使用泛型来定义接口的属性或方法。
interface Array<T> {length: number;push(...items: T[]): void;forEach(callbackfn: (value: T, index: number, array: T[]) => void): void;
}
- 泛型类:使用泛型来定义类的属性和方法的类型。
class GenericNumber<T> {zeroValue: T;add: (x: T, y: T) => T;
}
let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };
六,TypeScript 中高级类型的理解?
-
交叉类型
使用&
符号表示,可以将多个类型合并成一个类型。 -
联合类型
使用|
符号表示,可以表示一个值属于多种类型之一。 -
类型别名
使用type
关键字定义一个类型别名,方便在其他地方引用该类型。 -
类型索引
keyof 类似于 Object.keys ,用于获取一个接口中 Key 的联合类型。
interface Button {type: stringtext: string}type ButtonKeys = keyof Button// 等效于type ButtonKeys = "type" | "text"
- 类型约束
- 映射类型
通过in
关键字做类型的映射,遍历已有接口的key
或者是遍历联合类型
type Readonly<T> = {readonly [P in keyof T]: T[P];
};interface Obj {a: stringb: string
}type ReadOnlyObj = Readonly<Obj>
上述的结构,可以分成这些步骤:
- keyof T:通过类型索引 keyof 的得到联合类型 ‘a’ | ‘b’
- P in keyof T 等同于 p in ‘a’ | ‘b’,相当于执行了一次 forEach 的逻辑,遍历 ‘a’ | ‘b’
所以最终ReadOnlyObj的接口为下述:
interface ReadOnlyObj {readonly a: string;readonly b: string;
}
- 条件类型
使用extends
关键字和三目运算符?
和:
,可以根据类型关系推断出另一个类型。
六,TypeScript 中type与interface区别
- type 可以定义基本类型、联合类型、元组和其他自定义类型,而 interface 只能定义对象类型。
- interface 支持继承,而 type 不支持。
- 当定义类型别名时,type 可以使用联合类型、交叉类型和条件类型等高级类型,而 interface 不支持。
- type 是对类型的重新定义,而 interface 是对类型的声明。在某些情况下,type
可以使用更通用的语法,使得类型定义更加简洁易懂 - 在定义类型时,interface 可以使用 extends、implements 和 keyof 等关键字来增强类型的功能。
相关文章:
TS2023年面试题汇总~~~~持续更新中!!!!
文章目录一、typescript 的数据类型有哪些二、TypeScript 中枚举类型的理解三、TypeScript 中接口的理解四, TypeScript 中类的理解五,TypeScript 中泛型的理解?六,TypeScript 中高级类型的理解?六,TypeScr…...

CSS模块的书写以及删除线的作用和来历什么是删除线
<!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title><style>/*关羽这一行代码变为绿色*/#gy_li{color: green}/*张飞,苹果这一行代码变为黄色*/#zf_li,#pg_ul{color: yellow}/*i…...
Libhevc介绍
随着高清电视的普及和4K、8K超高清电视的出现,视频编解码技术也得到了广泛应用和发展。H.265/HEVC (High Efficiency Video Coding) 编解码标准作为一种新一代的视频编码技术,具有更高的压缩率和更好的画面质量,已经被成为未来视频编码的趋势…...
基于Tensorflow的最基本GAN网络模型
import tensorflow as tf from tensorflow import keras from tensorflow.keras import layers import matplotlib.pyplot as plt %matplotlib inline import numpy as np import glob import os #(1)创建输入管道 # 导入原始数据 (train_images, train…...
数据质量管理概述
1、数据质量的概念 指的是在组织业务,管理要求下,符合数据使用者满足业务,管理需求的评价方式 2、数据质量管理的概念 3、4种常见低质量数据情况 1)重要数据缺失 有些信息暂时无法获取或者获取代价太大信息在采集输入中遗漏属…...
C++ const、volatile和mutable关键字详解
对于cv(const 与 volatile)类型限定符和关键字mutable在《cppreference》中的定义为: cv可出现于任何类型说明符中,以指定被声明对象或被命名类型的常量性(constness)或易变性(volatility&#…...

MySQL实验四:数据更新
MySQL实验四:数据更新 目录MySQL实验四:数据更新导读表结构sql建表语句模型图1、 SQL更新:将所有学生的年龄增加1岁代码2、SQL更新:修改“高等数学”课程倒数三名成绩,在原来分数上减5分代码解析3、SQl更新:…...

商汤科技推出“日日新SenseNova”,大模型体系赋能人工智能新未来
2023年4月10日,商汤科技SenseTime技术交流日活动在上海举行,分享了以“大模型大算力”推进AGI(通用人工智能)发展的战略布局,并公布了商汤在该战略下的“日日新SenseNova”大模型体系。 公开信息显示,商汤科…...

【中创AI】斯坦福人工智能年度报告:AI论文发表量中国世界第一!
斯坦福以人为本人工智能研究所 (HAI) 发布了最新一期的 2023 AI 指数 (2023 AI Index) 报告,探讨了过去一年机器学习的发展。 (斯坦福HAI于2019年初成立,致力于研究新的AI方法,并研究该技术对社会的影响。其每年发布一份AI指数报…...

Java基础(五)面向对象编程(基础)
学习面向对象内容的三条主线 Java类及类的成员:(重点)属性、方法、构造器;(熟悉)代码块、内部类面向对象的特征:封装、继承、多态、(抽象)其他关键字的使用:…...

寻找CSDN平行世界的另一个你
本文由 大侠(AhcaoZhu)原创,转载请声明。 链接: https://blog.csdn.net/Ahcao2008 寻找CSDN平行世界的另一个你摘要前言列表测试目的摘要 本文作了一个测试,看看在 CSDN 的博文中,艾特()某个好友,TA是否能够…...

ChatGPT的发展对客户支持能提供什么帮助?
多数组织认为客户服务是一种开销,实际上还可以将客户服务看成是一种机会。它可以让你在销售后继续推动客户的价值。成功的企业深知,客户服务不仅可以留住客户,还可以增加企业收入。客户服务是被低估的手段,它可以通过推荐、见证和…...

数据安全评估体系建设
数据安全评估是指对重要数据、个人信息等数据资产的价值与权益、合规性、威胁、脆弱性、防护等进行分析和判断,以评估数据安全事件发生的概率和可能造成的损失,并采取相应的措施和建议。 数据安全评估的重要性和背景 1.国家法律法规下的合规需要 目前数…...

论文阅读 - ANEMONE: Graph Anomaly Detection with Multi-Scale Contrastive Learning
目录 摘要 1 简介 2 问题陈述 3 PROPOSED ANEMONE FRAMEWORK 3.1 多尺度对比学习模型 3.1.1 增强的自我网络生成 3.1.2 补丁级对比网络 3.1.3 上下文级对比网络 3.1.4 联合训练 3.2 统计异常估计器 4 EXPERIMENTS 4.1 Experimental Setup 4.1.1 Datasets 4.1.2 …...

数据密集型应用存储与检索设计
本文内容翻译自《数据密集型应用系统设计》,豆瓣评分高达 9.7 分。 什么是「数据密集型应用系统」? 当数据(数据量、数据复杂度、数据变化速度)是一个应用的主要挑战,那么可以把这个应用称为数据密集型的。与之相对的是…...

Spring Boot集成Redis实现keyspace监听 | Spring Cloud 34
一、前言 在前面我们通过以下章节对Redis的keyevent(键事件通知)使用有了基础的了解: Spring Boot集成Redis实现keyevent监听 | Spring Cloud 33 现在开始我们正式学习Redis的keyspace(键空间通知),在本…...

如何搭建chatGPT4.0模型-国内如何用chatGPT4.0
国内如何用chatGPT4.0 在国内,目前可以通过以下途径使用 OpenAI 的 ChatGPT 4.0: 自己搭建模型:如果您具备一定的技术能力,可以通过下载预训练模型和相关的开发工具包,自行搭建 ChatGPT 4.0 模型。OpenAI提供了相关的…...

【故障定位】基于多元宇宙算法的主动配电网故障定位方法研究(Matlab代码实现)
💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…...

基于html+css的自适应展示1
准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…...

DolphinDB +Python Airflow 高效实现数据清洗
DolphinDB 作为一款高性能时序数据库,其在实际生产环境中常有数据的清洗、装换以及加载等需求,而对于该如何结构化管理好 ETL 作业,Airflow 提供了一种很好的思路。本篇教程为生产环境中 ETL 实践需求提供了一个解决方案,将 Pytho…...
Vim 调用外部命令学习笔记
Vim 外部命令集成完全指南 文章目录 Vim 外部命令集成完全指南核心概念理解命令语法解析语法对比 常用外部命令详解文本排序与去重文本筛选与搜索高级 grep 搜索技巧文本替换与编辑字符处理高级文本处理编程语言处理其他实用命令 范围操作示例指定行范围处理复合命令示例 实用技…...
挑战杯推荐项目
“人工智能”创意赛 - 智能艺术创作助手:借助大模型技术,开发能根据用户输入的主题、风格等要求,生成绘画、音乐、文学作品等多种形式艺术创作灵感或初稿的应用,帮助艺术家和创意爱好者激发创意、提高创作效率。 - 个性化梦境…...

Lombok 的 @Data 注解失效,未生成 getter/setter 方法引发的HTTP 406 错误
HTTP 状态码 406 (Not Acceptable) 和 500 (Internal Server Error) 是两类完全不同的错误,它们的含义、原因和解决方法都有显著区别。以下是详细对比: 1. HTTP 406 (Not Acceptable) 含义: 客户端请求的内容类型与服务器支持的内容类型不匹…...
Java 8 Stream API 入门到实践详解
一、告别 for 循环! 传统痛点: Java 8 之前,集合操作离不开冗长的 for 循环和匿名类。例如,过滤列表中的偶数: List<Integer> list Arrays.asList(1, 2, 3, 4, 5); List<Integer> evens new ArrayList…...
Frozen-Flask :将 Flask 应用“冻结”为静态文件
Frozen-Flask 是一个用于将 Flask 应用“冻结”为静态文件的 Python 扩展。它的核心用途是:将一个 Flask Web 应用生成成纯静态 HTML 文件,从而可以部署到静态网站托管服务上,如 GitHub Pages、Netlify 或任何支持静态文件的网站服务器。 &am…...

2025 后端自学UNIAPP【项目实战:旅游项目】6、我的收藏页面
代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口(适配服务端返回 Token) export const login async (code, avatar) > {const res await http…...
聊一聊接口测试的意义有哪些?
目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开,首…...
Angular微前端架构:Module Federation + ngx-build-plus (Webpack)
以下是一个完整的 Angular 微前端示例,其中使用的是 Module Federation 和 npx-build-plus 实现了主应用(Shell)与子应用(Remote)的集成。 🛠️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...
JS设计模式(4):观察者模式
JS设计模式(4):观察者模式 一、引入 在开发中,我们经常会遇到这样的场景:一个对象的状态变化需要自动通知其他对象,比如: 电商平台中,商品库存变化时需要通知所有订阅该商品的用户;新闻网站中࿰…...

免费数学几何作图web平台
光锐软件免费数学工具,maths,数学制图,数学作图,几何作图,几何,AR开发,AR教育,增强现实,软件公司,XR,MR,VR,虚拟仿真,虚拟现实,混合现实,教育科技产品,职业模拟培训,高保真VR场景,结构互动课件,元宇宙http://xaglare.c…...