前端八股文

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

最近在辅导同学准备春招/实习时，发现很多同学项目都写了埋点监控。埋点看似简单，because你调用个sdk，跟fetch一样用但是众所周知，带厂就喜欢搞花里胡哨的问法，不仅可以涉及具体的技术实现（如 sendBeacon、IntersectionObserver），更考验你对 业务的理解（埋什么）、对 性能的权衡（何时发）、对 数据准确性 的保障（如何不丢数据）以及 系统设计 的能力（如何设计一个SDK）。这份总结将带你从浅入深，逐一击破这些考点。1. 基础概念与价值 (What & Why)面试官会先从基础问题入手，判断你是否理解埋点的核心目的。什么是前端埋点？你为什么要做埋点？考察...

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

谁会啊谁会啊谁会阿

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

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

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

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

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

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.反问狠狠地拷打了八股，问了很久但是后边也没有具体下一次面试的消息什么的，堪称一次八股盛宴但是没用下文，唉，只能再慢慢接着再找找看别的工作哩

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

多做一些面试的准备，其实面试也没有那么难，不要裸面，现在无非就是那些问题，好好准备就行了！给大家分享下最近整理的前端开发面试专题及答案，可以对照这查漏补缺：🍀 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题）还有最新的场景题项目题集等，助小伙伴们都能顺利上岸！

最近在辅导同学准备春招/实习期间，发现很多同学因为缺乏系统准备，错过了最佳求职时机。今天要分享的是在前端面试中必考模块——「前后端交互」，尤其在有实际项目经验的场景下，面试官会重点考察你是否理解接口的设计、数据通信的流程、安全机制与优化手段。本文将从基础到进阶逐层拆解，帮你构建扎实的答题体系。一、HTTP 请求流程与数据交互基础1.前端是如何发起请求的？常见工具：fetch、axios、XMLHttpRequest请求方式：GET、POST、PUT、DELETE（RESTful API）携带数据方式： GET：query 参数拼接在 URLPOST：请求体中（如 JSON / FormData...

博主有一天向ai问了一个神金的问题：是谁先发现代码需要打包的？^^ 博主没有经过知识污染的大脑就是这样的干净。作为学生，在自己做项目练手的时候，从来都是在开发环境下，很少有接触到生产环境。打包/构建/工程化/模块化/...，这种概念从来没有出现在博主的脑子里。然而八股文要考，于是博主只能硬着头皮理解了。所以这是一个博主在阅读了部分八股文，拷打ai，加上个人理解之后的一篇关于前端工程化的自用总结文章。一、模块化——代码组织的基本法关于前端工程化，我想从模块化讲起。1.1 早期方案早期前端项目规模小，代码直接通过<script>标签引入浏览器。 <!-- 传统的开发方式 --&g...