场景题18
1.
在开发过程中,你如何确保代码的可维护性?
2.
性能优化手段?
3.
React和Vue在技术层面有哪些区别?
4.
CDN能部署SPA应用吗?
5.
前端性能监控指标采集方案?
6.
ES模块转CommonJS最大难点?
7.
哪些资源不需要浏览器缓存?
8.
如果你的网站加载时间过长,你会如何诊断并解决此问题?
9.
介绍一下TypeScript的优势及其在你的项目中的应用。
10.
在项目中引入新技术或工具的决策过程是怎样的?
11.
为什么会有跨域?一般解决跨域的手段都有哪些?
12.
解释服务端渲染(SSR)、客户端渲染(CSR)、静态渲染(ssg)的差异及各自的优势。
13.
在前端项目中,你如何管理和优化依赖项?
14.
Vite为什么比Webpack快?
15.
简述HTTPS密钥交换原理。
16.
简述CSRF、XSS、SQL注入和DDoS攻击的区别,如何防御?
17.
对工程化的理解.
18.
从架构设计角度分析单页应用首屏加载优化。
Vue 框架40
1.
Vue的$nextTick方法的原理是什么?它是如何实现的?
2.
请简述Vue 3中虚拟DOM Diff算法的主要优化点。
3.
Vue组件之间有哪些通信方式?
4.
Vue 3中的ref和reactive有什么区别?
5.
Vue 3.5版本对watch的deep选项有什么优化?(需查阅具体更新日志)
6.
Vue中的watch和computed有什么区别?各自适用于什么场景?
7.
Vue生命周期钩子created和mounted有什么区别?
8.
Vue的父组件和子组件,它们的生命周期钩子函数的执行顺序是怎样的?
9.
Vue 3为什么选择用Proxy替换Object.defineProperty来实现响应式?
10.
Vue 3为什么要同时提供ref和reactive两种响应式API?
11.
Vue 3.5版本引入了useTemplateRef,它有什么作用?(需查阅具体更新日志)
12.
Vue 3.5版本中,关于Props的响应式更新有什么新变化?(需查阅具体更新日志)
13.
Vue 3.0在模板编译方面做了哪些优化?(提示:静态节点提升、补丁标志等)
14.
为什么Vue组件中的data选项必须是一个函数,而不是一个普通对象?
15.
在一个Vue项目中,如何做权限管理?如果要控制到按钮级别的权限,可以怎么做?
16.
请列举Vue 3的所有生命周期钩子函数,并与Vue 2的进行对比。
17.
Vue中有哪些常用的指令修饰符(如.stop、.prevent)?
18.
Vue 3的DOM Diff中,使用“最长递增子序列”算法优化了什么场景?
19.
尝试手动实现一个简化版的alien-signals依赖构建机制。
20.
Vue Router的hash模式和history模式有什么区别?
21.
Vue 3.6中的alien-signals是什么?它的调试文件和使用方式是怎样的?(需查阅具体提案)
22.
Vue 3的Composition API和React的Hooks在理念和实现上有何异同?
23.
Vue 2和Vue 3在核心设计上有哪些主要区别?
24.
请描述Vue 2响应式系统的核心原理,包括Observer、Dep、Watcher这三个关键角色是如何协作的。
25.
请列举Vue 2的所有生命周期钩子函数,并说明它们分别在哪个阶段被调用。
26.
Vue 2实例在初始化过程中主要做了哪些事情?
27.
Vue 2中,为什么无法监听通过数组下标(索引)直接修改数组元素的变化?
28.
alien-signals中使用了哪些位运算来优化状态管理?
29.
alien-signals中状态机的设计是怎样的?
30.
alien-signals中建立响应式关系(依赖追踪)的方案是什么?
31.
alien-signals中的signal核心概念是什么?
32.
alien-signals中的“染色算法”是如何进行性能优化的?
33.
alien-signals如何用栈结构来替代递归,以避免栈溢出?
34.
alien-signals中,数据变化(信号)是如何传播的?
35.
alien-signals如何运用图论的思想来管理依赖关系?
36.
alien-signals采用了哪种传播模型?(例如Push-Pull模型)
37.
alien-signals的依赖构建过程是如何工作的?
38.
在Vue 2中,使用delete操作符删除数组元素和使用Vue.delete方法删除数组元素有什么区别?
39.
请分析alien-signals依赖构建部分的源码逻辑。
40.
代码分析:以下两段Vue模板代码在渲染时,分别会渲染多少次?为什么?
Typescript6
1.
TypeScript和JavaScript的主要区别是什么?
2.
TypeScript中的“接口”是什么?它主要用于哪些方面?
3.
什么是TypeScript的“类型注解”?它有什么作用?
4.
TypeScript的“接口”和“类型别名”有什么区别?在什么场景下应该选择哪一个?
5.
在TypeScript中,定义变量类型有哪几种主要方式?
6.
请解释TypeScript中的“类型别名”和“交叉类型”分别是什么,有何用途。
算法题16
1.
二叉树的前序、中序、后序和层序遍历分别如何实现?
2.
反转一个单链表。
3.
如何将字符串’abcde’反转?
4.
青蛙跳台阶问题(斐波那契数列)。
5.
数组的sort()方法在V8引擎内部是如何实现排序的?
6.
如何使用原生JavaScript进行DOM节点的创建、添加、移除、移动、复制和查找操作?
7.
如何“原地”打乱一个数组(洗牌算法)?
8.
求多个集合的笛卡尔积。
9.
拓扑排序给定一组模块及其依赖关系,如何确定一个合法的加载顺序?
10.
实现一个函数,输出给定数字或字符串的所有全排列。
11.
如何快速找到一个单向链表的中间节点?
12.
请列举JavaScript数组常用的操作方法(如增删改查、遍历、转换等)及其用途。
13.
根据给定的数据结构,还原一棵树形结构。
14.
给定一个字符串,找出其中不含有重复字符的最长子串的长度。
15.
将一个多维数组降维(扁平化)为一维数组。
16.
给定一个字符串,判断是否能通过重新排列其字母构成一个回文串。
工程化54
1.
Vue的官方脚手架是什么?它提供了哪些开箱即用的功能?
2.
如何在Node.js(Koa/Express)中设置允许跨域访问的白名单?
3.
Webpack中有哪些“神奇注释”(Magic Comments)?它们有什么作用?
4.
什么是“幽灵依赖”?如何解决它带来的问题?
5.
Webpack中常用的Plugin有哪些?它们各自实现什么功能?
6.
Webpack中的Loader和Plugin有什么区别?
7.
Redis和Kafka有什么区别?它们各自的核心用途是什么?
8.
Webpack中常用的Loader有哪些?它们各自处理什么类型的文件?
9.
Webpack的主要作用是什么?
10.
现代构建工具Vite和Webpack的主要区别是什么?
11.
什么是DevOps?
12.
如何规范Git的提交信息(Commit Message)?
13.
如何查看Git仓库中某个文件的修改历史?
14.
MySQL数据库的索引是如何工作的?有哪些创建索引的规则或最佳实践?
15.
MySQL和MongoDB有什么区别?各自适用于什么场景?
16.
Node.js有什么特点?
17.
Kafka是什么?它主要用于什么场景?
18.
Webpack的“热更新”(Hot Module Replacement)是如何工作的?
19.
Babel的工作原理是什么?它如何将ES6+代码转换为ES5代码?
20.
如何提升Webpack的构建速度?
21.
请尝试编写一个简单的Webpack Plugin。
22.
请简述Webpack的构建流程。
23.
请举一个Webpack代码分包的例子,并说明其好处。
24.
请尝试编写一个简单的Webpack Loader。
25.
前端开发中,“模块化”和“组件化”有什么区别?
26.
创建一个React项目通常使用什么脚手架工具?
27.
在使用Git时,为什么会发生代码冲突?如何解决冲突?
28.
在数据库设计中,为什么有时不推荐使用“自增ID”作为数据的唯一标识
29.
在Node项目的package.json中,dependencies和devDependencies有什么区别?
30.
在前端团队协作中,制定设计文档规范有什么好处?
31.
在前后端分离开发中,如何解决前端开发对后端API的联调依赖问题?
32.
数据库设计中的“范式”是什么?常用的有哪几个范式?
33.
什么是Git Flow工作流?
34.
为数据库表创建索引有什么优点和缺点?
35.
什么是“反向代理”?它和“正向代理”有什么区别?
36.
如何配置Nginx来实现一个简单的静态文件服务器?
37.
如何让Git忽略某些不需要提交的文件(如配置文件、node_modules)?
38.
如何配置Nginx的反向代理来解决前端开发中的跨域问题?
39.
请谈谈你对Docker的理解,它在前端领域有什么应用?
40.
请写出一些常用的SQL语句(如SELECT、INSERT、UPDATE、DELETE、CREATE TABLE等)。
41.
如果不小心做了一个错误的提交,如何撤销它?(区分已推送和未推送)
42.
对于一个Node.js服务器应用,从它接收到一个HTTP请求的URL开始,到最终返回响应,中间大致经历了哪些处理步骤?
43.
SQL中如何进行多表关联查询(JOIN)?
44.
请简述Git的基本使用流程(如克隆、提交、推送、拉取等)。
45.
Redis是什么?它有什么特点?
46.
Node.js主要可以用于哪些场景?
47.
Koa和Express框架有什么区别?
48.
MySQL常用的存储引擎有哪些?
49.
git reset、git revert和git checkout这三个命令有什么区别?
50.
InnoDB和MyISAM存储引擎有什么区别?
51.
Git和SVN有什么区别?
52.
git rebase和git merge有什么区别?
53.
git fetch和git pull命令有什么区别?
54.
ESLint有什么作用?
CSS39
1.
父容器内居中方案
2.
Relative与Absolute定位机制深度对比
3.
Line-height与Height的区别及应用
4.
JS修改样式方式
5.
三栏布局核心实现方案解析
6.
CSS元素分类详解
7.
Box-sizing属性与盒模型控制
8.
Retina屏幕0.5px细线实现方案
9.
Transition与Animation动画特性对比
10.
Less与Sass预处理器深度对比
11.
iframe优缺点分析及现代应用场景
12.
HTML语义化价值与最佳实践
13.
HTML5 Input类型扩展与表单增强
14.
响应式布局主流技术方案演进
15.
HTML5新特性与语义化演进
16.
Flexbox弹性布局核心概念与实战
17.
CSS重绘与回流机制及其性能优化策略
18.
Display属性inline、block与inline-block对比
19.
CSS元素隐藏方案及其区别对比
20.
CSS伪类与伪元素核心差异解析
21.
Background-color填充区域详解
22.
Img标签的置换元素特性解析
23.
CSS元素水平垂直居中方案全解
24.
CSS引入方式Link与Import深度对比
25.
CSS盒子模型与标准差异详解
26.
CSS属性继承机制与不可继承属性
27.
CSS calc()函数原理与实战技巧
28.
文本溢出省略号实现方案
29.
浏览器回流触发机制分析
30.
CSS伪元素单冒号与双冒号规范
31.
CSS选择器优先级与权重计算规则
32.
CSS实现动画的三种主流方式
33.
CSS浮动原理与清除浮动策略
34.
CSS常用单位全解析:px%2Frem%2Fem%2Fvw%2Fvh%2Frpx
35.
CSS Position定位机制全解
36.
CSS Margin塌陷与BFC原理解析
37.
渐进增强与优雅降级理念深度剖析
38.
CSS3新特性概览与实战应用
39.
CSS Overflow属性详解及应用场景
JavaScript97
1.
<script>标签的async和defer属性有什么区别?它们如何影响脚本的加载和执行?
2.
在JavaScript中,如何判断一个对象(Object)是否为空(不包含任何自身属性)?
3.
在使用Ajax时,有哪些方法可以避免浏览器缓存请求结果?
4.
什么是“回调地狱”?有哪些方法可以解决或缓解它?
5.
“事件冒泡”和“事件捕获”有什么区别?如何阻止事件的传播或默认行为?
6.
this指向题 (2)
7.
Promise.all()、Promise.allSettled()、Promise.any()和Promise.race()这些方法分别适用于什么场景?
8.
prototype和__proto__有什么区别和联系?
9.
在JavaScript中,将字符串转换为数字有哪些方法?parseInt()、parseFloat()和Number()有什么区别?
10.
什么是“事件委托”(或事件代理)?它有什么优点?
11.
如何创建一个自定义Hook?它用于什么场景?
12.
如何给网页添加一个半透明的水印?
13.
请实现一个“防抖”函数。
14.
请简述ES6、ES7、ES8等主要ECMAScript版本各自引入了哪些标志性的新特性?
15.
判断字符串是否以某子串开头,用startsWith()和indexOf()两种方法有什么区别?
16.
解释一下JavaScript中“执行上下文”和this指向的关系。
17.
除了console.log,你还知道哪些console对象的方法?它们对调试有什么帮助?
18.
并发控制题:实现一个函数,能控制并发请求的数量,最多同时执行N个请求。
19.
编程题:请描述或实现一个基本的元素拖拽功能。
20.
(关于隐藏类)在V8引擎中,以下两段创建对象的代码,哪段运行效率更高?为什么?
21.
(关于数组模式)在V8引擎中,以下两段操作数组的代码,哪段效率更高?为什么?
22.
this指向题 (1)
23.
null和undefined在JavaScript中有什么区别?
24.
JavaScript中的new操作符在创建一个对象实例时,内部经历了哪些步骤?
25.
mouseover/mouseout和mouseenter/mouseleave这两组鼠标事件有什么区别?
26.
JavaScript中==(宽松相等)和===(严格相等)运算符有什么区别?
27.
JavaScript为什么被设计为单线程?这样设计的主要目的是什么?
28.
JavaScript有哪些数据类型?如何区分基本数据类型和引用数据类型?
29.
JavaScript的函数参数是“按值传递”还是“按引用传递”?请举例说明。
30.
eval()函数有什么功能?使用它可能存在哪些安全隐患?
31.
ES6中的Symbol类型有什么特性?它主要用于什么场景?
32.
document.write()和innerHTML在操作DOM时有什么区别?
33.
ES5的继承(基于原型)和ES6的继承(基于class)在实现上有什么区别?
34.
DOM元素的Attribute(属性)和Property(特性)有什么区别?
35.
computed属性是如何实现缓存的?它缓存了什么?
36.
async/await和Promise是什么关系?它们是如何协同工作的?
37.
bind、apply、call这三个方法有什么区别?请描述它们的内部实现原理。
38.
在JavaScript中,有哪些方法可以用来判断一个变量的数据类型?
39.
在JavaScript中,实现数组去重有哪些常见的方法?
40.
在JavaScript中,如何判断两个对象是否“相等”(内容相同)?
41.
在JavaScript中,如何监听对象属性的变化?(提示:Object.defineProperty或Proxy)
42.
在JavaScript中,如何遍历一个对象的所有属性?有哪些方法?
43.
在JavaScript中,创建对象有哪几种方式?
44.
在JavaScript中,创建函数有哪几种方式?
45.
在实际项目中,你是如何划分“技术组件”和“业务组件”的?
46.
在渲染列表时,为什么需要给每个子元素设置一个唯一的key?
47.
原型链实践题:请分析以下代码,为什么输出是2?
48.
在哪些情况下可以“延长”作用域链?
49.
在浏览器的事件循环中,不同类型的宏任务(如setTimeout、setImmediate、I/O、UI渲染)是否有优先级?
50.
为什么不能用Array.sort(() => Math.random() - 0.5)这种方式来真正公平地打乱数组?
51.
手动实现一个instanceof操作符的功能。
52.
为什么computed属性中不支持异步操作?
53.
事件的三要素是什么?
54.
使用let关键字声明变量有什么特点?(如块级作用域、暂时性死区等)
55.
手动实现一个简易的响应式数据系统(包含依赖收集和触发更新)。
56.
实现一个set函数,可以根据一个路径字符串(如’a.b.c’)来设置深层嵌套对象的属性值。
57.
实现一个once函数,确保传入的函数只被执行一次。
58.
使用JavaScript实现的动画和CSS3实现的动画主要有什么区别?
59.
什么是JavaScript的“作用域链”?它是如何形成的?
60.
实现一个通用的“柯里化”高阶函数,可以将任意函数柯里化。
61.
实现一个柯里化函数add,使得add(1)(2)(3)返回6。
62.
什么是JavaScript的“装箱”机制?基本类型是如何拥有方法的?
63.
什么是JavaScript的“变量提升”和“函数提升”?当它们同时存在时,谁的优先级更高?
64.
什么是“类数组”(或伪数组)?如何将一个类数组对象转换为真正的数组?
65.
什么是“内存泄漏”?在JavaScript中,常见的导致内存泄漏的情况有哪些?
66.
什么是“惰性函数”?它有什么应用场景?
67.
什么是“闭包”?它有什么作用和可能带来的问题?
68.
什么是“高阶组件”(HOC)?它有什么作用?
69.
如何实现一个sleep函数,让程序暂停一段时间?
70.
设计题:实现一个图片上传管理器,要求同时最多上传N张,每当有1张上传成功,就自动补上1张新的,始终保持N张在上传。
71.
如何在前端实现下载图片的功能?
72.
如何实现一个对象的“深拷贝”?
73.
如何实现方法的“链式调用”?
74.
如何实现一个私有变量,只能通过特定的get和set方法访问,而不能直接访问?
75.
如何让watch能深度监听一个对象内部所有属性的变化?
76.
如何区分一个变量是数组还是对象?
77.
如何去除字符串首尾的空格?
78.
如何判断一个对象是否存在“循环引用”?
79.
如何获取一个DOM元素在页面中的确切位置(相对于视口或文档)?
80.
如何理解箭头函数“没有自己的this”这一说法?
81.
如何给DOM元素绑定事件监听器?如何移除?
82.
如何获取格式为“年-月-日 时:分:秒”的当前日期字符串?
83.
如何给一个按钮绑定多个点击事件处理函数?
84.
如果console.log方法被重写了,如何获取到原始的console.log方法?
85.
请描述JavaScript中变量(基本类型和引用类型)在内存(堆和栈)中是如何存储的。
86.
请实现一个“节流”函数。
87.
请解释Promise是什么,它解决了什么问题?
88.
请描述DOM的事件模型(DOM Level 0, Level 2, Level 3)。
89.
请描述实现一个可拖动元素的基本思路和方案。
90.
请解释JavaScript中的“强制类型转换”和“隐式类型转换”,并举例说明。
91.
请解释“宿主对象”、“内置对象”和“原生对象”的概念,并举例说明。
92.
请解释并举例说明数组的reduce方法如何使用,它适合处理哪些场景?
93.
请将原生的XMLHttpRequest封装成一个返回Promise的ajax函数。
94.
清空一个数组有哪些方法?它们之间有何区别?
95.
编程题:实现一个函数b,使得调用b(cb).then(...)时,then中能打印出cb函数执行时的参数值。
96.
编程题:如何获取页面上所有<a>标签的href属性值?
97.
“展示组件”和“容器组件”的区别是什么?
React 框架21
1.
请简述React的虚拟DOM Diff算法的大致原理。
2.
React性能优化方案。
3.
React有哪些性能优化手段?这些优化通常和哪些生命周期钩子或Hooks相关?
4.
React中为什么要引入Hooks?它主要为了解决类组件的哪些问题?
5.
在React类组件中,通常在哪个生命周期钩子里发起数据请求?在函数组件中呢?
6.
什么是“虚拟DOM”?它有什么好处?
7.
请解释React的Fiber架构解决了什么问题?
8.
ReactFiber为什么需要双key?
9.
Redux主要解决了什么问题?它有什么优点和缺点?
10.
React中什么是“受控组件”和“非受控组件”?
11.
React中组件的“状态”(state)和“属性”(props)有什么区别?
12.
React中的refs有什么作用?
13.
React中的“Context”是什么?它解决了什么问题?
14.
React类组件有哪些生命周期方法?它们分别在什么阶段调用?
15.
React是如何实现数据驱动视图(MVVM中的数据绑定部分)的?
16.
React是MVVM框架吗?为什么?
17.
什么是Flux架构?它和Redux有什么关系?
18.
虚拟DOM在React中有什么意义?
19.
React的“类组件”和“函数式组件”有什么区别?Hooks出现后,这种区别有何变化?
20.
如何在React函数组件中使用useState Hook来管理状态?
21.
如何在React函数组件中使用useEffect Hook来执行副作用操作?
�
社区热榜
1在开发过程中,你如何确保代码的可维护性?Hot
2性能优化手段?Hot
3请简述React的虚拟DOM Diff算法的大致原理。Hot
4React和Vue在技术层面有哪些区别?
5CDN能部署SPA应用吗?
6前端性能监控指标采集方案?
7ES模块转CommonJS最大难点?
8父容器内居中方案
9二叉树的前序、中序、后序和层序遍历分别如何实现?
10Vue的$nextTick方法的原理是什么?它是如何实现的?