前端八股文

#前端##前端面试##前端面试题##前端八股文##web前端#

我五月也是面试了十几家前端，其实面试官问的问题都大差不差，无非就是一些场景题。 前端已上岸，我之前自己准备整理的场景题合集用不上了，发给有需要的人，放后面啦～

如题，这是一位同学面完字节分享的题目，字节总体上难度会比较大，所以没准备好建议不要约面，留下脏面评会影响后面投递。前端开发中，热更新（Hot Module Replacement, HMR）几乎是必不可少的功能。它能够在代码修改后无需刷新页面就实时生效，大幅提升开发效率。尽管 Webpack 和 Vite 都支持 HMR，但两者的底层实现方式完全不同。理解这些机制不仅能帮助我们优化开发体验，也能在面试中回答得更有深度。一、热更新的基本概念热更新的核心目标是：在代码改动后，只替换变更的模块，而不是整页刷新。其基本流程包括三部分：监听文件变化；通知浏览器；浏览器执行模块替换。无论是 Webpack...

最近很多27找实习，大部分面试会问一下flex布局这种基础前端问题，上周有同学反馈蔚来一面有出过，所以小圆不仅整理了flex还整理了grid方便学习以及比较。在现代前端开发中，CSS 布局系统的核心已从传统的浮动与定位，逐步过渡到 Flexbox 与 Grid。这两种布局方案在现代浏览器中均得到广泛支持，它们在理念上有明显差异，也各自适用于不同的布局场景。本文将系统梳理两者的特性、差异与应用边界，为开发者提供实践层面的参考。一、布局理念对比特性维度FlexboxCSS Grid布局维度一维布局（单行或单列）二维布局（行与列）主轴与交叉轴主轴控制方向，交叉轴自动调整行列均可精确控制子元素排列根据...

时长1h自我介绍JS 有几种声明变量的方法？ var、let、const 有什么区别？什么是块级作用域？  ES6 之前是否有块级作用域？如何用函数作用域模拟块级作用域？  IIFE 的作用是什么？有什么优缺点？Promise 有哪些常用方法？ Promise.all 的作用是什么？如果其中一个 Promise 失败，其他 Promise 的结果能否拿到？ 如何实现无论成功失败都拿到所有 Promise 的结果？Promise.race 的应用场景是什么？async/await 和 Promise 的关系？ async/await 异常捕获有几种方式？await 等待的是什么？为什么 asyn...

多做一些面试的准备，其实面试也没有那么难，不要裸面，现在无非就是那些问题，好好准备就行了！给大家分享下最近整理的前端开发面试专题及答案，可以对照这查漏补缺：🍀 JavaScript（323题）🍀 CSS（61题）🍀 HTML（57题）🍀 React（83题）🍀 Vue（80题）🍀 算法（19题）🍀 计算机网络（71题）🍀 Node.js（27题）🍀 TypeScript（46题）🍀性能优化（25题）🍀 前端安全（21题）🍀 小程序（9题）🍀 ES6（32题）🍀 编程题（50题）🍀 设计模式（7题）🍀 前端工程化（34题）还有最新的场景题项目题集等，助小伙伴们都能顺利上岸！

1.自我介绍还有功能实现2.css3新特性 （选择器，文字特效，圆角radios，transform位移，旋转，缩放等）3.动画实现方式有哪几种（当时只提到了animation来实现，后面知道可以直接贴gif或者canvas和3d引擎来实现）4.如何隐藏一个元素（当时回答了v-show和v-if，emm后边面试官说不是这个的才回答visibility：hiden和display：none，不过其实还可以使用z-index:-1和opacity和scale缩放来进行隐藏）5.是否使用过媒体查询（emm，没听说过，后边了解到是能在不同的条件下使用不同的样式，使页面在不同在终端设备下达到不同的渲染效果。其原理就是允许添加表达式用以媒体查询，以此来选择不同的样式表，从而自动适应不同的屏幕分辨率。）6.css预处理器（less，scss 相同点:变量，继承，嵌套，混入，不同点：更多的数学函数支持单位运算）7.选择器权重8.position属性值，使用已经性能区别（relative，absolute，static，fix，粘性定位）9.js中脚本延迟加载方法有哪几种（promise，setTimeout等）10.作用域有哪些11.es6的新特性有哪些（class类，var，let，const，模块引入，promise，箭头函数，扩展运算符等）12.var，let，const区别13.数组循环方法（for循环，forEach，map方法）14.promise捕获异常从哪里获取15.vue中计算属性名与data中的同名吗（没听说过，不过网上说技术上可以但是不建议，因为有可能会导致混淆与覆盖的问题）16.vue常用的指令17.nextTick18.前端权限控制19.插槽20.具体怎么进行组件的封装呢，前端水印实现逻辑（添加使用 CSS 伪元素或者canvas）21.vue性能优化方法22.反问狠狠地拷打了八股，问了很久但是后边也没有具体下一次面试的消息什么的，堪称一次八股盛宴但是没用下文，唉，只能再慢慢接着再找找看别的工作哩

#我的秋招日记##前端##前端工程师##前端八股文##社招##秋招#

一、准备原则：围绕项目，深挖思路在前端面试中，项目经验往往是切入技术能力、架构理解和解决问题能力的重要入口。因此，项目准备不只是“做过什么”，更重要的是能完整、清晰、逻辑性强地表达出来自己在项目中的角色与技术决策，即便项目是模拟的、未完全实现也无妨，关键在于你是否能讲清楚每个功能点的实现方式与原理。二、准备内容结构1. 功能拆解：你做了什么、每一块怎么做的逐个功能点梳理：示例： 我们做了一个权限控制模块，前端用路由守卫和按钮级别权限控制实现。使用 Vue Router 的 beforeEach 守卫，在用户登录后加载权限列表，动态生成可访问路由。同时通过指令封装 <permission-...

这是之前一个27同学面滴滴实习的题目，部门是体验平台，针对浏览器缓存问了强弱缓存区别以及使用场景等问题，小圆这边整理好了～浏览器缓存是前端性能优化中最重要的一环。合理利用缓存，不仅能显著提升页面加载速度、减少服务器压力，还能改善用户体验。但在面试中，很多人只会“Cache-Control、ETag、Expires”这几个名词，却说不清底层逻辑与交互过程。本文讲解浏览器缓存机制，从类型、原理到实践配置，帮你彻底吃透这个高频考点。 一、缓存的分类概览浏览器缓存大体分为两类：类型是否向服务器发请求命中后资源来源常用字段强缓存（Strong Cache）否本地缓存（Memory/Disk）Cache-...

最近在辅导同学准备春招/实习时，发现很多同学对模块化的理解不够清晰，今天小圆就来系统性地讲解一下。🧩什么是模块将一个复杂的程序依据一定的规则(规范)封装成几个块(文件), 并进行组合在一起。块的内部数据与实现是私有的, 只是向外部暴露一些接口(方法)与外部其它模块通信。简单来说也就是，模块就是把一段独立、可复用的逻辑封装起来，并且可以导入导出。就像我们平时玩的乐高或者拼图，每个乐高小块就是一个模块。你可以单独制造、保存它，然后在不同的拼搭里拿来用。它自己有形状（接口），别人只需要知道怎么拼接，不用管内部细节。原始阶段：全局变量、函数阶段在早期的JavaScript开发中，JavaScript...

在前端面试中，Webpack 一直是高频考点之一。而在所有模块化相关的问题中，“import 导入时 Webpack 在干什么” 这类问题经常被问到。乍看只是一个语法糖，但背后其实包含了 模块解析、依赖图构建、代码转换、打包优化 等一整套复杂流程。本文小圆将带你从源码构建视角，彻底弄清楚 import 背后 Webpack 的工作原理～～～一、整体流程概览当你在代码中写下这一行时： import { foo } from './b.js'; Webpack 的处理流程大致如下：解析阶段（Parsing）：扫描代码，提取所有 import 语句；模块定位（Resolving）：根据路径或模块名找...

#前端##前端开发##前端面试##前端八股文##现在前端的就业环境真的很差吗##面试##面经##面试问题记录##web前端#

#前端##前端开发##前端面试##前端八股文##vue##web前端##现在前端的就业环境真的很差吗##牛客创作赏金赛##牛客激励计划#