前端面试题 口语化复述解答(从2025.3.8 开始频繁更新中)

news2025/3/9 13:42:50

背景

看了很多面试题及其答案。但是过于标准化,一般不能直接用于回复面试官,这里我将总结一系列面试题,用于自我复习也乐于分享给大家,欢迎大家提供建议,我必不断完善之。

Javascript

ES6

1. var let const 的区别:

它们均是变量声明的关键字,其中let const是ES6新增关键字。引入这两个关键字的原因在于var没有块级作用域所导致变量滥用的问题。

  1. var自带变量提升,js编译的时候会将所有用var声明的变量语句提升到整个作用域首位,所以在原有声明前引用该变量不会报错。
  2. 而let const在变量声明前引用则会报错,原因即此二者无法变量提升导致存在暂时性死区,即从当前作用域的首部开始到变量声明前的上下文无法引用该变量
  3. var 滥用原因还有可以多次声明同一标识符,这是let const无法做到的。并且由于var 没有块级作用域,用var声明了一个标识符后 在其块级作用域后又重新声明一次则会导致原值被替换为新值。但是var是拥有函数作用域的,所以在函数中重新声明该标识符,在函数作用域外的值则不会被替换,但是如果没用var声明而只是赋值则会被替换。
  4. let 和 var的值是可以修改的,const 声明的变量对应的地址中的值是不能修改,但是如果当期变量是对象的话,其声明变量的地址中的值是一个指针,指向堆中的值,此时我们可以修改堆中的值(即const变量修改对象的属性是生效的)
  5. 根据最佳实践来说,尽量能用const就不用let,能用let就不用var

2. Promise 是什么?为什么要使用Promise?它的原理是什么?

Promise 名为期约,是 ES6新引入的一种JavaScript异步解决方案。它用于解决ES6之前连续多次异步操作时传统异步编程的多层回调嵌套的问题,俗称回调地狱。通过连续的then或catch的链式调用,降低了编码的难度同时又增加了代码的可读性。

// ES6以前的异步编程
doFirstThing(data,function (err1, data1) {
	if(err1) {
		...
		return
	}
	doSecondThing(data1, function (err2, data2){
		if(err2) {
			...
			return
		}
		doThrdThing(data2, function (err3, data3) {
			if(err3){
				...
				return
			}
			...
		})
	})
})

// Promise异步编程
doFirstThing(data).then((data) => doSecondThing(data)).then((data) => doThirdThing(data)).catch((err) => {}).finally(() => {...})
  1. 基本用法
    Promise是一个对象,它有三种状态。即 Pending (进行中)Fulfilled (已完成的, 即成功状态) Rejected (已拒绝的,即失败状态), 当我们生成一个Promise的时候, 状态只能有一种改变,即从Pending-> Fulfilled或从Pending->Rejected。此三者是在其构造函数中进行处理,当我们 new 一个 Promise的时候,需要传入一个函数, 拥有 resolve和 reject方法,通过调用resolve(data) 表示成功处理数据状态,转到链式流程中的then方法中进行后续处理, 通过调用reject(err)表示处理期约失败的数据状态,最后还有一个finnally执行的回调,不管处理成功还是失败都会执行此回调。但其实then也能处理失败的回调,用于局部错误处理。通过then 使用第二个回调函数的参数即代表失败拒绝状态回调
new Promise((resolve, reject) => {
	...
	resolve(data)
	...
	reject(err)
}).then((data) => { ... }, (err) => { ... }).catch((err) => {})

但一般我们使用catch来全局处理err,这样语义化分工更易于理解,并且不需要每次then中使用第二个参数控制err更加方便处理。

  1. 静态方法

另外 Promise作为构造函数包含以下6种静态方法

Promise.resolve
Promise.reject
Promise.all
Promise.allSettled
Promise.race
Promise.any

a. 其中Promise.resolve和Promise.reject返回的分别是成功和失败的Promise对象,等价于前文new Promise((resolve, reject) => {}) 分别调用resolve和reject函数

b. Promise.all([promise1, promise2, promise3]) 并行执行多个Promise, 当所有promise处理成功时即返回一个处理结果数组,依次为传入promise数组的处理结果。当某个Promise拒绝时,直接返回拒绝状态的err。

c. Promise.allSettled([promise1, promise2, promise3]) 格式与all类似,但它会等待所有promise返回结果,最后生成一个对象

//成功
{ status: 'fulfilled', value: results }

//失败
{ status: 'rejected', reason: err }

d. Promise.race([promise1, promise2, promise3]) 为Promise竞速, 返回第一个完成的promise无论成功还是失败。

e. Promise.any([promise1, promise2, promise3]) 类似于Promise.race,但是它是返回的第一个已经成功的promise实例,如果全部失败则会报错

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

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

相关文章

网络安全技术和协议(高软43)

系列文章目录 网络安全技术和协议 文章目录 系列文章目录前言一、网络安全技术1.防火墙2.入侵检测系统IDS3.入侵防御系统IPS 二、网络攻击和威胁三、网络安全协议四、真题在这里插入图片描述 总结 前言 本节讲明网络安全技术和协议方面的相关知识。 一、网络安全技术 1.防火…

K8S学习之基础十七:k8s的蓝绿部署

蓝绿部署概述 ​ 蓝绿部署中,一共有两套系统,一套是正在提供服务的系统,一套是准备发布的系统。两套系统都是功能完善、正在运行的系统,只是版本和对外服务情况不同。 ​ 开发新版本,要用新版本替换线上的旧版本&…

【网络】TCP常考知识点详解

TCP报文结构 TCP报文由**首部(Header)和数据(Data)**两部分组成。首部包括固定部分(20字节)和可选选项(最多40字节),总长度最大为60字节。 1. 首部固定部分 源端口&…

LeetCode1137 第N个泰波那契数

泰波那契数列求解:从递归到迭代的优化之路 在算法的世界里,数列问题常常是我们锻炼思维、提升编程能力的重要途径。今天,让我们一同深入探讨泰波那契数列这一有趣的话题。 泰波那契数列的定义 泰波那契序列 Tn 有着独特的定义方式&#xf…

六十天前端强化训练之第十四天之深入理解JavaScript异步编程

欢迎来到编程星辰海的博客讲解 目录 一、异步编程的本质与必要性 1.1 单线程的JavaScript运行时 1.2 阻塞与非阻塞的微观区别 1.3 异步操作的性能代价 二、事件循环机制深度解析 2.1 浏览器环境的事件循环架构 核心组件详解: 2.2 执行顺序实战分析 2.3 Nod…

利用EasyCVR平台打造化工园区视频+AI智能化监控管理系统

化工园区作为化工产业的重要聚集地,其安全问题一直是社会关注的焦点。传统的人工监控方式效率低下且容易出现疏漏,已经难以满足日益增长的安全管理需求。 基于EasyCVR视频汇聚平台构建的化工园区视频AI智能化应用方案,能够有效解决这些问题&…

【VUE2】第三期——样式冲突、组件通信、异步更新

目录 1 scoped解决样式冲突 2 data写法 3 组件通信 3.1 父子关系 3.1.1 父向子传值 props 3.1.2 子向父传值 $emit 3.2 非父子关系 3.2.1 event bus 事件总线 3.2.2 跨层级共享数据 provide&inject 4 props 4.1 介绍 4.2 props校验完整写法 5 v-model原理 …

深度学习分类回归(衣帽数据集)

一、步骤 1 加载数据集fashion_minst 2 搭建class NeuralNetwork模型 3 设置损失函数,优化器 4 编写评估函数 5 编写训练函数 6 开始训练 7 绘制损失,准确率曲线 二、代码 导包,打印版本号: import matplotlib as mpl im…

在Linux中开发OpenGL——检查开发环境对OpenGL ES的支持

由于移动端GPU规模有限,厂商并没有实现完整的OpenGL特性,而是实现了它的子集——OpenGL ES。因此如果需要开发的程序要支持移动端平台,最好使用OpenGL ES开发。 1、 下载支持库、OpenGL ES Demo 1.1、下载PowerVRSDK支持库作为准备&#xff…

基于Spring Boot的学院商铺管理系统的设计与实现(LW+源码+讲解)

专注于大学生项目实战开发,讲解,毕业答疑辅导,欢迎高校老师/同行前辈交流合作✌。 技术范围:SpringBoot、Vue、SSM、HLMT、小程序、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容:…

os-copilot安装和使用体验测评

简介: OS Copilot是阿里云基于大模型构建的Linux系统智能助手,支持自然语言问答、命令执行和系统运维调优。本文介绍其产品优势、功能及使用方法,并分享个人开发者在云服务器资源管理中的实际应用体验。通过-t/-f/管道功能,OS Cop…

Geo3D建筑材质切换+屋顶纹理

一、简介 基于Threejs开发封装建筑渲染管线,利用简单二维建筑矢量面轮廓程序化生成3D建筑,支持材质一键切换,支持多样化建筑墙面材质和屋顶材质,支持建筑透明,支持地形高程适配,支持按空间范围裁剪挖洞等。…

【GPT入门】第9课 思维树概念与原理

【GPT入门】第9课 思维树概念与原理 1.思维树概念与原理2. 算24游戏的方法 1.思维树概念与原理 思维树(Tree of Thought,ToT )是一种大模型推理框架,旨在解决更加复杂的多步骤推理任务,让大模型能够探索多种可能的解决…

栈概念和结构

文章目录 1. 栈的概念2. 栈的分类3. 栈的实现(数组栈)3.1 接口设计(Stack.h)3.2 接口实现(Stack.c)1)初始化销毁2)栈顶插入删除3)栈顶元素、空栈、大小 3.3 完整代码Stac…

Spring (八)AOP-切面编程的使用

目录 实现步骤&#xff1a; 1 导入AOP依赖 2 编写切面Aspect 3 编写通知方法 4 指定切入点表达式 5 测试AOP动态织入 图示&#xff1a; 实现步骤&#xff1a; 1 导入AOP依赖 <!-- Spring Boot AOP依赖 --><dependency><groupId>org.springframework.b…

VS Code连接服务器教程

VS Code是什么 VS Code&#xff08;全称 Visual Studio Code&#xff09;是一款由微软推出的免费、开源、跨平台的代码编辑神器。VS Code 支持 所有主流操作系统&#xff0c;拥有强大的功能和灵活的扩展性。 官网&#xff1a;https://code.visualstudio.com/插件市场&#xff1…

Windsuf 连接失败问题:[unavailable] unavailable: dial tcp...

问题描述 3月6日&#xff0c;在使用Windsuf 时&#xff0c;遇到以下网络连接错误&#xff1a; [unavailable] unavailable: dial tcp 35.223.238.178:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of…

docker中kibana启动后,通过浏览器访问,出现server is not ready yet

问题&#xff1a;当我在浏览器访问kibana时&#xff0c;浏览器给我报了server is not ready yet. 在网上试了很多方法&#xff0c;都未能解决&#xff0c;下面是我的方法&#xff1a; 查看kibana日志&#xff1a; docker logs -f kibana从控制台打印的日志可以发现&#xff…

更多文章请查看

更多文章知识请移步至下面链接&#xff0c;期待你的关注 如需查看新文章&#xff0c;请前往&#xff1a; 博主知识库https://www.yuque.com/xinzaigeek

(十 九)趣学设计模式 之 中介者模式!

目录 一、 啥是中介者模式&#xff1f;二、 为什么要用中介者模式&#xff1f;三、 中介者模式的实现方式四、 中介者模式的优缺点五、 中介者模式的应用场景六、 总结 &#x1f31f;我的其他文章也讲解的比较有趣&#x1f601;&#xff0c;如果喜欢博主的讲解方式&#xff0c;…