前端面试

在浏览器中，不同标签页之间进行通信是一个常见的需求，例如： 用户在 A 标签页登录后，希望 B 标签页自动刷新状态。 多个页面需要共享某个数据源或状态。 实现“跨页面广播”功能（如通知所有打开的页面执

在现代 Web 开发中，我们经常需要处理大量数据或执行高频率的任务。然而，如果一次性执行数十万甚至上百万个任务，很可能会导致页面“假死”或完全无响应。这是因为 JavaScript 是单线程语言，所有

在 JavaScript 中，虽然 ES6 引入了 class 关键字让面向对象编程更加直观和易读，但其底层机制仍然是基于原型（prototype）的继承模型。本文将带你一步步理解： 如何手动实现类似

在现代 JavaScript 开发中，ES Module（ESM） 和 CommonJS（CJS） 是两种主流的模块化规范。它们在加载机制、变量作用域、语法结构和执行行为上存在显著差异。本文将从多个维

🌟 引言 在现代前端开发中，热模块替换（Hot Module Replacement, HMR） 是一项提升开发效率的关键技术。它允许我们在不刷新整个页面的前提下，动态更新代码，并且尽可能地保留当前应

框架 开发语言 平台支持 主要特点 优点 缺点 React Native JavaScript (React) iOS、Android 组件化开发、桥接原生模块 社区活跃、性能好、第三方库多 桥接层性

可以使用 promisify 函数将 Node.js 的回调风格 API 转换为 Promise 风格。Node.js 自带 util.promisify 方法来实现这个转换，但如果我们手动实现 pr

以下是 React 常用的优化方式总结表： 优化方式 描述 适用场景 React.memo 记忆化函数组件，避免不必要的重新渲染 纯展示组件，props 稳定的组件 useMemo & useCall

状态管理库 理念 主要特点 适用场景 优点 缺点 Redux 单一状态树，单向数据流 使用 reducer 生成不可变状态，支持中间件（Redux Thunk、Saga） 大型项目、团队协作、需要明确

浏览器解析 HTML 资源的过程是将 HTML 文档转换为浏览器可以理解和呈现的结构的关键步骤。这个过程涉及多个阶段，从接收到 HTML 文档开始，到最终生成 DOM 树并准备渲染。以下是详细的解析过

解析文档到渲染过程中的优化可以显著提高网页的加载速度和用户体验。以下是这个过程中的几个关键步骤及其优化点的总结： 1. 文档解析流程 HTML 解析：浏览器逐行读取 HTML 文档，并构建 DOM 树

类别 内容 缓存类型 强缓存 - Cache-Control：通过设置缓存指令控制资源的有效期。 - max-age=<seconds>：指定资源在缓存中可存活的时间。 - no-cache：强制在使

HTTP/2 相较于 HTTP/1.x 引入了多项显著的改进和变化，旨在提高网络性能和效率。以下是 HTTP/2 和 HTTP/1.x 之间的主要变化和改进： 特性 HTTP/1.x HTTP/2 协

前端性能优化可以从加载、渲染、交互和缓存等多个阶段着手。在每个阶段采取合理的优化策略，不仅能提高页面的加载速度，还能提升用户的交互体验。以下是前端性能优化的各个阶段和对应的优化策略： 以下是前端各阶段

总结 特性 箭头函数 普通函数 this 绑定 继承定义位置的上下文 (词法作用域) 由调用方式决定（调用者） 构造函数调用 不支持，不能使用 new 支持，可以使用 new arguments 对象

在 React 中使用 Hooks 的确有一些严格的限制条件，主要是为了确保 Hooks 的运行和管理符合 React 的架构设计，保证组件状态和副作用的正确性和一致性。以下是这些限制的原因和原理：

在 React 组件中绑定事件与直接操作 DOM 绑定事件的差异主要体现在以下几个方面： 比较维度 React 事件绑定 直接操作 DOM 事件绑定 事件绑定方式 使用事件委托，将所有事件挂载在顶层容

示例代码 假设我们有两个模块：一个 ESM 格式和一个 CommonJS 格式： math.js (CommonJS) index.js (ESM) 使用 Webpack 编译后的代码 Webpack

Loader 案例：多语言翻译 Loader 这个自定义 Loader 旨在支持多语言翻译功能。在项目开发中，文本字符串通常会放在一个 JSON 文件中，如 en.json 和 zh.json，分别用

在 Webpack 中，Loader 和 Plugin 是扩展 Webpack 功能的两种方式。它们分别在不同的阶段作用于 Webpack 构建流程中，用于处理和优化项目资源： Loader 和 Pl