中等
中等 361
如何设置 SSH 的 IP 白名单？
设置 SSH 的 IP 白名单可通过配置 sshd_config、使用 IPTables 或管理 hosts.allow/hosts.deny 文件实现，每种方法都有其优缺点和适用场景。
如何用 JavaScript 实现数组的去重？请举几个例子。
在 JavaScript 中，数组去重可以通过多种方法实现。比如使用 Set、filter 和 indexOf 的组合，或者 reduce 方法。
执行 SQL 语句 select * from user where id = 1 发生了什么？
分析在 Web 应用中执行 `select * from user where id = 1` 这样的 SQL 语句时涉及的流程和安全风险，重点讨论参数处理方式及其对 SQL 注入的影响。
如何使用 Performance API 测量首屏时间？
首屏时间通过 Performance API 中的 First Contentful Paint (FCP) 指标衡量，用于优化网页加载速度。
什么是 TypedArray？
TypedArray 是 JavaScript 的类数组结构，用于高效处理二进制数据。它依赖于 ArrayBuffer，并通过固定元素类型提供高性能的数据操作。
如何判断文件中的换行符是 LF 还是 CRLF？
这个问题要求识别文本文件中的换行符类型，通常涉及对不同操作系统的理解以及如何检测这些换行符。解决方案包括使用文本编辑器、命令行工具和编程方法。
如何区分 HTTP 头中的 no-cache 和 no-store？
HTTP 头中的 no-cache 和 no-store 指令分别影响浏览器的缓存机制。no-cache 允许缓存但需验证，而 no-store 完全禁用缓存。
React 中 useCallback 的使用场景是什么？
React 中的 useCallback Hook 可用于缓存函数实例，防止不必要的重新渲染和计算。通过固定依赖项数组的大小和内容，确保函数在相同的输入下保持一致，从而提升应用的性能。
如何在 useEffect 中使用 async/await？
探讨如何在 React 的 useEffect 钩子内安全地使用 async/await 处理异步操作，包括 IIFE 和单独定义函数的方法。
如何使用 async/await 实现 Promise.all 的效果？
详细介绍了如何利用 async/await 实现 Promise.all 的并发效果，并比较了不同实现方法的优缺点。
如何在 JavaScript 中捕捉到完整的错误堆栈信息？
讨论了在异步代码、生产环境及错误处理配置中导致 JavaScript 无法捕捉到异常堆栈信息的常见情况，并提供了相应的解决方案。
如何监听 Node.js 中异步资源的生命周期？
Node.js 提供 async_hooks 模块来监听和跟踪异步资源的生命周期。通过注册钩子函数，可以捕捉到异步操作的不同阶段，如初始化、执行前后及销毁事件。这有助于开发者进行性能分析和资源监控。
textContent、innerText 和 innerHTML 的区别是什么？
解释 JavaScript 中 textContent、innerText 和 innerHTML 的区别。
Vue 中 ref 和 reactive 的区别与联系是什么？
探讨 Vue 3 的 Composition API 中 ref 和 reactive 的区别与应用场景，分析它们各自的优缺点。
Node.js 中 --max-old-space-size=4096 是什么意思？
问题：Node.js 中的 --max-old-space-size=4096 有什么作用？解答：这个选项用于设置 V8 引擎的旧生代内存上限，通常在处理大数据或复杂项目时避免内存溢出。
如何在 Node.js 应用中监控 GC 事件？
Node.js 应用的垃圾回收可以通过多种方式进行监控，如使用 GCStats 模块、Node 性能平台和 V8 日志。这些方法帮助开发者分析内存管理和优化。
什么是 Service Mesh？它能解决什么问题？
Service Mesh 是一种用于微服务架构中的网络基础设施层，通过 Sidecar 代理处理服务间通信。它简化了服务间的网络逻辑，并提供了流量控制、安全管控和故障恢复等功能。
在 Kubernetes 中 Deployment 和 StatefulSet 有什么区别？
Kubernetes 中的 Deployment 和 StatefulSet 是两种不同的控制器类型，用于管理有状态和无状态应用。它们的区别主要在于应用场景、Pod 管理方式以及数据持久性。
Git reset 和 revert 的区别是什么？
Git 中的 `reset` 和 `revert` 是两种用于修改项目版本控制历史的方法，主要区别在于它们如何处理提交记录以及对工作区的影响。
bind、call 和 apply 的区别是什么？
介绍了 JavaScript 中 bind、call 和 apply 的区别，包括执行时机、参数传递方式以及返回类型。通过示例展示了它们的使用场景，帮助理解选择合适的函数上下文操作方法。
Gzip 压缩的工作原理是什么？如何在前端项目中进行配置？
介绍了 gzip 基于 DEFLATE 算法的压缩流程，包括 LZ77 和 Huffman 编码，并展示了如何在 Nginx 服务器上配置 gzip 压缩。
HTTP 状态码中 301、302 和 307 的区别是什么？
HTTP 状态码 301、302 和 307 的区别主要在于重定向的语义和对请求方法的影响。301 表示永久重定向，通常会更改请求方法；而 302 和 307 都是临时重定向，但 307 强制保...
HTTP 状态码 502 和 504 有什么区别？
HTTP 状态码 502（Bad Gateway）和 504（Gateway Timeout）的区别在于前者表示中间服务器收到无效响应，后者表示等待上游服务器响应超时。
不同端口（如 localhost:3000 和 localhost:5000）之间的 Cookie 是否共享？
在不同的本地端口上运行的应用程序之间，Cookie 是否会被共享？这是理解浏览器如何处理跨域请求的重要基础。
什么是 package-lock.json？没有它会怎样？
了解 package-lock.json 的作用以及其对依赖管理的重要性。在没有它的情况下，项目的依赖版本可能不一致，并且可能导致构建不稳定。
Webpack 中已引入但未使用的模块会被打包吗？
Webpack 默认情况下会打包所有 import 的模块，不论是否使用。通过 Tree Shaking 技术可以在生产模式或手动配置下优化移除未使用代码。
如何在 Node.js 中判断一个路径是文件还是文件夹？
Node.js 判断路径类型：使用 fs.statSync 或 fs.stat 方法，并通过 stats 对象的 isFile 和 isDirectory 属性确定。
如何获取 Node.js 项目的 CPU 配置文件快照？
Node.js 性能优化中，了解如何获取 CPU 分析快照对排查性能瓶颈至关重要。本文介绍了两种主要方法：使用内置命令行参数和 `v8-profiler` 模块。
display:inline 的元素设置 margin 和 padding 会生效吗？
display:inline 元素的 margin 在水平方向上有效，而竖直方向上的 padding 和 margin 不起作用。
如何区分 preload 和 prefetch 在前端中的作用？
preload 与 prefetch 的区别在于加载时机、优先级和应用场景。前者用于关键资源，后者用于预加载未来需要的内容。
Node.js 中使用 require 加载模块时发生了什么？
描述了 Node.js 中 require 函数在加载模块时执行的一系列步骤，包括缓存检查、模块解析、定位与加载、编译和执行模块以及更新缓存。
optionalDependencies 的使用场景是什么？
optionalDependencies 允许将某些依赖声明为可选，避免安装失败影响项目。常用于 npm 和 Maven 工具。
Fetch API 中 credentials 参数的作用是什么？
fetch API 中的 credentials 参数用于控制凭证发送行为，默认为 'omit'。它有三种取值：omit、same-origin 和 include，分别适用于不同的请求场景。
package-lock.json 和 yarn.lock 的区别是什么？
package-lock.json 和 yarn.lock 都是用于管理依赖版本的文件，但它们分别由 npm 和 Yarn 生成，结构和用途有所不同。
IPv4 和 IPv6 的主要区别是什么？
IPv4 与 IPv6 在地址空间、配置方式、安全性及数据包大小等方面存在显著差异。IPv4 使用 32 位地址，而 IPv6 使用 128 位地址。
localhost 与 127.0.0.1 有什么区别？
localhost 和 127.0.0.1 都用于访问本地计算机，但它们在技术实现和行为上有所不同。127.0.0.1 是 IPv4 地址，而 localhost 是主机名。
如何在 Nginx 中配置 WebSocket 支持？
面试问题：如何在 Nginx 中配置 WebSocket 支持？答案摘要：介绍 Nginx 配置 WebSocket 支持的基本步骤和关键配置。
在 JavaScript 中使用 new 操作符创建对象时，具体执行了哪些步骤？
JavaScript 中 new 操作符的内部工作流程包括对象创建、原型链接、this 绑定及返回值判断。理解这些步骤有助于掌握对象构造机制。
什么是 HTTPS？HTTPS 和 HTTP 的区别是什么？
HTTPS 是基于 SSL/TLS 加密的 Web 传输协议，提供数据安全性和身份认证。与 HTTP 相比，HTTPS 使用加密通信以增强安全性。
你了解 requestIdleCallback 的工作原理和应用场景吗？
requestIdleCallback 是一种浏览器 API，用于在主线程空闲时执行低优先级任务。它适用于非关键性的日志上报、资源预加载和分片处理大型任务。
Node.js 中 dns.resolve 和 dns.lookup 的区别是什么？
在 Node.js 中，dns.resolve 和 dns.lookup 在 DNS 解析机制、资源使用和应用场景上有显著差异。理解这些区别有助于优化网络请求和提高系统性能。
如何设计 Prometheus 中的 metric？
在使用 Prometheus 进行监控时，合理设计 metric 是关键。本文将介绍 metric 的命名规范、标签选择以及不同类型的选择方法。
如何衡量 Serverless 的冷启动时间？
Serverless 函数首次启动的延迟（即冷启动）是关键性能指标。本题详细探讨了如何测量和优化冷启动时间，涉及使用云监控工具、日志分析、专用框架以及基准测试等多种方法。
如何通过 Kubernetes 日志追踪特定请求进入的 Pod？
此问题涉及在 Kubernetes 集群中定位和分析特定请求处理情况，需要掌握基本的日志查看命令以及 pod 标签选择器的使用。
Sentry 中 withScope、configureScope 和直接 setTags 的区别是什么？
在 Sentry 中，作用域管理是通过 withScope 创建临时作用域，通过 configureScope 修改全局作用域，而直接 setTags 则会影响所有后续事件。
Node.js 中 module.exports 和 exports 的区别是什么？
在 Node.js 中，module.exports 和 exports 都用于导出模块内容，但它们之间存在关键区别。exports 是 module.exports 的引用，但在赋值操作时行为不同。
如何将 JSON 数据转化为文件并下载？
描述了如何使用 JavaScript 将 JSON 数据转化为 downloadable 文件的方法，并提供了两种实现方式：Data URL 和 Blob + Object URL。
什么是 Iterable 对象？与 Array 有什么区别？
探讨 JavaScript 中 Iterable 对象与 Array 的区别，包括定义方式、访问方式和遍历操作。通过理解这些差异，掌握如何在实际开发中选择使用。
如何使用 Node.js 在服务器端处理文件上传？
解释了如何在 Node.js 中使用 Express 和 Multer 处理文件上传。提供了一个简单的示例，展示了从设置项目到处理上传的完整流程，并讨论了其他替代方案和安全注意事项。
如何在 Redux 中发送网络请求？
在 Redux 中发送网络请求需要使用异步中间件如 redux-thunk 或 Redux Toolkit 的 createAsyncThunk 来处理异步逻辑，更新应用状态。
如何选择前端项目的状态管理器？
在为前端项目选择合适的状态管理器时，应考虑项目框架、规模和特定需求。中等难度的问题需要对不同状态管理器的特点和适用场景有深入理解，并能够权衡各种因素做出合理决策。
如何在 Redux 中创建一个日志记录插件来跟踪状态变更？
学习如何创建一个 Redux 中间件来监控和记录应用的状态变更。通过这个过程，你可以深入了解 Redux 的中间件机制以及状态管理。
如何在生产环境中部署 Node.js 应用？
Node.js 应用的生产部署步骤，包括服务器准备、依赖管理、构建、启动和反向代理配置。使用 PM2 进行进程管理和 Nginx 作为反向代理。适用于中等难度的前端面试题。
什么是 Core Dump？如何配置与分析？
Core dump 是 Linux 系统在进程异常崩溃时生成的转储文件，用于调试程序错误。本题详细讲解了 Core dump 的配置方法和分析工具。
HTTP 状态码 401 和 403 有什么区别？
HTTP 401 和 403 是两个常见的状态码，分别用于表示 unauthorized 和 forbidden 错误。了解它们的区别对解决前端问题很重要。
如何在前端项目中进行 SEO 优化？
优化前端项目 SEO 涉及 HTML 结构、元标签、性能优化及技术基础设施。通过合理设置 Meta 标签、使用语义化标记和提升页面速度，可以有效提高搜索引擎排名。
如何处理 JavaScript 中的 this 指向问题？
JavaScript 中的 this 指针在不同调用方式下有不同的指向。需要了解其作用机制，并掌握通过 bind、call、apply 以及箭头函数等方法来控制和处理 this 的问题。
如何解决 SSR 中的样式闪烁问题？
服务端渲染中，样式闪烁是常见的一个问题。本文详细分析了其原因，并给出了多种解决方案，如将 CSS 置于头部、避免使用 @import、嵌入关键 CSS 以及利用框架工具处理异步样式管理。
什么是 SSR 中的水合作用及其常见问题？
服务端渲染（SSR）中的水合作用是什么？它在实现过程中可能遇到哪些问题？这是前端面试题中关于 SSR 机制的重要内容，考察候选人对现代 web 开发技术的理解。
Git pull 与 fetch 的区别是什么？
Git pull 和 fetch 的区别在于 fetch 只获取数据而不会改变本地分支，pull 则会获取并合并到当前分支。这属于 Git 基础操作的知识。
如何使用 OAuth 2.0 实现第三方登录？
介绍通过 OAuth 2.0 协议实现第三方登录的完整流程，包括注册开发者账号、配置授权参数、前端发起请求、获取授权码、兑换访问令牌以及处理用户登录状态。
WebSocket 和 HTTP 长轮询有什么区别？
WebSocket 与 HTTP 长轮询的区别主要在于通信机制、性能及应用场景。WebSocket 提供全双工通信，而 HTTP 长轮询是半双工且每次请求。
HTTPS 中如何实现对称加密与非对称加密的应用？
HTTPS 使用混合加密机制，结合对称和非对称加密来确保数据传输的安全性。首先在握手阶段使用非对称加密进行身份验证和密钥交换，然后利用对称加密高效地保护后续的数据传输。
HTTP 状态码有哪些类别及其常见的含义是什么？
HTTP 状态码分为五种主要类型：1xx 信息、2xx 成功、3xx 重定向、4xx 客户端错误和 5xx 服务器错误。常见如 200 OK, 301 永久重定向，304 未修改，401 未经授...
工具类型（Utility Types）如 Partial、Pick、Record 的使用场景
介绍了 Partial、Pick 和 Record 的使用场景，并通过示例代码说明了它们在实际开发中的应用场景。
如何优化 TypeScript 配置以提升代码质量？
介绍 TypeScript 的 `tsconfig.json` 中几个常用的配置选项及其作用，如 `target` 和 `strict`。
如何解释 TypeScript 中 any、unknown 和 never 类型的区别？
讨论了 TypeScript 中 any、unknown 和 never 类型的区别，包括它们的特性、风险和适用场景。
如何优化 SPA 应用的首屏加载速度？
SPA 应用的首屏加载缓慢通常与 JavaScript 文件大小、网络延时或资源重复加载有关。通过代码分割、资源优化和使用服务端渲染技术可以有效提升加载速度。
为什么在 Vue 中不推荐同时使用 v-if 和 v-for？
讨论 Vue.js 中不建议在同一个元素同时使用 v-if 和 v-for 的原因，包括性能影响、优先级问题及代码可维护性。
Flexbox 布局的核心概念和应用
Flexbox 提供了一种强大的一维布局模型，用于在容器内灵活排列元素。理解其核心属性如 flex-direction、justify-content 和 align-items 是掌握该技术的关键。
你了解 ES6+ 中的可选链和空值合并运算符吗？
探讨 ES6 及以上版本中新引入的可选链（Optional Chaining）和空值合并运算符（Nullish Coalescing Operator），分析它们的作用、语法以及实际应用场景。
Webpack 中 Loader 和 Plugin 有什么区别？
Webpack 中的 Loader 用于处理资源文件的转换，而 Plugin 用于扩展构建功能。它们在作用、运行时机和配置方式上有显著区别。
BFC 的触发条件及其在布局中的作用是什么？
BFC（Block Formatting Context）是 CSS 中的一个关键概念，用于控制网页元素的布局。本文详细阐述了 BFC 的触发条件以及它在网页布局中的重要作用。
如何使用 CSS 实现网站的暗黑模式？
介绍三种方法实现纯 CSS 暗黑模式：响应系统偏好设置、用户切换主题、以及使用 filter 技巧。推荐结合 CSS 变量和媒体查询以增强灵活性和可维护性。
数据库设计中 CHAR 和 VARCHAR 的区别是什么？
CHAR 和 VARCHAR 是两种不同的字符串类型，它们在存储机制、空间利用和性能方面存在差异。CHAR 固定长度，而 VARCHAR 可变长度，并且存储方式不同会影响数据的读写速度。
如何设置和删除 Cookie？
介绍了在 JavaScript 中通过操作 document.cookie 来实现 Cookie 的设置与删除，包括参数配置、示例代码以及跨浏览器兼容性。
如何实现一个深拷贝函数？
描述了在 JavaScript 中使用 JSON 序列化和反序列化以及自定义递归深拷贝函数来实现对象的深层复制。讨论了各自的优缺点、适用场景及限制，还涉及了边界问题处理和优化建议。
HTTP2 的新特性及其优势是什么？
HTTP2 引入了多项关键特性，提升了前端应用的速度和效率。主要新特性包括二进制分帧、多路复用、头部压缩等，显著降低了页面加载延迟并提高了网络吞吐量。
前端如何监控和处理错误？
探讨了使用 try-catch、全局错误处理、资源加载监听、Promise 异步错误捕获以及框架特定方法来监控和处理 JavaScript 错误。还介绍了 Sentry 等常用工具的集成与应用。
你如何理解 Babel 在现代前端开发中的作用？
Babel 是一个 JavaScript 转译工具，用于将现代语法转为兼容旧环境的代码。它支持语法转换、自动注入 Polyfill 并与构建工具集成，帮助开发者提升效率和代码兼容性。
如何实现一个无限滚动的列表？
讨论了如何通过 JavaScript 监听滚动事件来实现无限滚动列表。包括 HTML 结构、CSS 样式和 JavaScript 逻辑的具体步骤，以及性能优化策略。
什么是 ClickJacking？如何防范？
ClickJacking 是一种恶意网络攻击技术，通过隐藏的 iframe 覆盖网页内容，诱使用户执行 unintended 操作。本题探讨了其工作原理及前端防御策略。
Next.js 中 getInitialProps 和 getStaticProps 的作用是什么？
解析 Next.js 中的 getStaticProps 用于生成静态页面以提升 SEO 和加载速度，而 getInitialProps 在页面加载时获取数据，但已被逐步弃用。
如何在 React 中实现代码拆分？
代码拆分是一种优化前端性能的技术，通过将应用代码拆分成多个小块按需加载。在 React 中，可以通过动态 import ()、React.lazy 和路由组件等多种方法实现。
什么是 React Portal？它有什么用途？
React Portal 是一种机制，允许将子组件渲染到 DOM 树的不同位置。主要用于解决视觉层级限制问题，并保持 React 上下文和事件机制。
什么是 React Hook？它为何被引入？
React Hook 是 React 中用于管理状态和副作用的新 API，如 useState 和 useEffect。它们解决了类组件中的复用难题。
什么是任务自动化工具（如 Gulp、Webpack）？它们的作用是什么？
任务自动化工具用于自动执行开发中的重复性任务，例如编译和打包。Gulp 和 Webpack 是常见的工具，分别用于任务运行和模块打包，帮助提高开发效率。
什么是渐进式 Web 应用（PWA）？
渐进式 Web 应用（PWA）是一种基于 Web 技术构建的应用模式，提供类似原生应用的体验。它通过 Service Workers 和响应式设计实现离线功能和高性能。
如何区分 Cookies、sessionStorage 与 localStorage？
Cookies 主要用于服务器端的会话管理，而 sessionStorage 和 localStorage 属于 HTML5 Web Storage API，分别用于临时数据和持久化存储。
如何实现 JavaScript 的防抖（debounce）函数？
JavaScript 中的防抖函数是一种优化技术，用于减少事件处理的频率。例如，在输入框中输入时触发验证请求，使用防抖可以避免在短时间内多次发送请求。
JavaScript 中的变量提升是什么？
变量提升指的是在 JavaScript 中，在编译阶段将变量和函数声明提前到其作用域顶部的行为，需注意赋值和访问顺序的问题。了解提升机制有助于避免一些常见的错误和提高代码的可维护性。
JavaScript 中的闭包及其应用和问题
模块化编程通过定义清晰的代码块来提高可维护性和复用性。通过使用模块系统如 ES6 的 import/export 或 AMD/CMD 模块加载器，可以有效地组织和管理代码。
如何区分 JavaScript 中的 var、let 和 const？
在 JavaScript 中，`var`、`let` 和 `const` 是用于变量声明的关键字，它们之间存在一些关键区别。
CSS 中 display:none 和 visibility:hidden 的区别是什么？
比较 display: none 和 visibility: hidden 的区别及其对布局的影响。