零基础自学前端人的求职路，面经&资源分享

前言

从 2016年本科毕业开始，一路跌跌撞撞走了很多弯路，在机缘巧合下，走上了前端开发之路，作为一个非计算机专业且学历一般的人来说，自学编程其实不是件容易的事情，不过庆幸的是自己坚持下来了。

目前工作还算不错，收入在目前所在的城市不算高，不算低，生活也还过得去，继续加油努力，也希望自己在今后更上一层。

从2019年下半年开始，我真正接触前端，到现在一年多的时间。开始之初，我没有任何的语言基础，完全从零的小白开始，就连「对象」我都弄不明白，更别说那些高深莫测的什么封装、继承、多态等。

当时自己也不知从何入手，怎么办呢？于是每当自己遇到困难时，就厚着脸皮去请教前辈大牛，然后就是去查阅资料，很多时候自己也很觉得不好意思，现在才发现人很多时候都耻于相别人请教，怕自己丢面子。

但作为一个过来人，我要告诉你请教前辈大牛真的很重要，可以让你少走很多的弯路，不要怕丢人，没面子，面子值几个钱？学到真本事才最重要。没有技能才叫真的没有面子。当然了我们在请教别人时，一定要掌握「度」，不要打扰到了别人的工作。

我现在非常感谢前辈们的赐教，也感谢那些在网上写博客、文章分享的大牛们，给了我们这些自学的小白很多的资料，经验，心得。从中受益很多。

向优秀的前辈们学习，我开始写博客，希望也能帮到和我一样，学渣、从零开始、喜欢技术的一群志同道合的人。

我深知自己的技术并不高，还处在继续学习的路上，离大牛还差的很远，我本身也非常敬畏技术，也知道自己的渺小，只希望这篇文章的「学习之路」对于那些「从零开始」学习前端的同学有一些指引作用，不像自己一开始那样的那么盲目，哪怕对你有一点点的帮助，就足够了。

说了这么多，下面我们直接进入正题，都是我平时学习和收集的一些面试资料希望能够帮到你。

面试高频问题

1、JavaScript

• 讲讲 js数据类型 ？基本和引用的区别？ symbol 和 bigint 讲一讲应用场景？
• 判断数据类型的方法？ instanceof 原理?判断 空对象 ？ typof null ？ typeof NaN ？
• var/let/const 区别？ 暂时性死区 ？ 块级作用域 ？const a = {}; a.x = 1 能不能修改？
• 说说你对 函数式编程 的理解？ 函数柯里化 的理解？平时的使用场景？
• 防抖、节流 的含义，使用场景？ 手写一下 ？
• call、apply、bind区别？ bind实现 ？bind之后还能修改this指向吗？为什么？
• 闭包概念，最主要的还是问 闭包的场景 ？
• 用 es5实现es6 类的继承？各种继承问的挺多的
• 深拷贝与浅拷贝？常用方法？手写一个 深拷贝函数 ？
• 说说你知道的JavaScript 设计模式 ？观察者和发布订阅的区别？ 手写 一个发布订阅？我真的写了
• 说说对你对JavaScript 异步编程 的理解？
• ES Module 与 CommonJS 模块的差异？两者互相加载的方式？一般会扯到AMD
• Promise .all、race、allSettled 概念、手写？很多手写题都会用到，比如用promise实现请求 并发个数 限制？

2、Css

• 水平垂直 居中 ？兼容性？ 不知道宽高 情况下？
• BFC概念？作用？ 常用场景 ？
• Flex？注意 flex：1 的含义，一般会给你个场景题
• 盒模型 概念，如何 切换 盒模型？
• 实现 1px 边框？1px线条？
• 伪类 和 伪元素 区别？使用场景？

3、Http && 浏览器

• 浏览器 缓存 ？http缓存？ 主要要 讲一讲 强缓存、协商缓存、preload、prefetch、Service Worker等， 304 的含义？协商缓存 e-tag 是怎么生成的？ Last-Modified 是基于什么生成的？两者对比一下？ 优先级 哪个高？
• 什么是 跨域 ？什么情况下会跨域？浏览器根据什么 字段 判断是否允许跨域？跨域的 解决方案 有哪些？ options 请求了解过吗？说说CORS中的 简单请求 和 复杂请求 ？ form表单提交 会跨域吗？
• 讲一讲浏览器事件循环 Event Loop ？node 事件循环 描述一下？
• http2 有哪些新特性？ http2 还有哪些缺陷？ http3 的一些了解？
• 从输入 URL 到页面加载完成的过程 ，一般要很详细的描述：包括 DNS查询 ， 缓存 查询， 3次握手 ， 4次挥手 ，浏览器 渲染进 程等，面试官会从里面再挑几个问题深入问，比如为什么是3次握手4次挥手？渲染进程中的GUI渲染线程、JS引擎线程、事件触发线程等等？可能会问到进程线程的区别？浏览器为什么是多进程？js为什么是单线程？怎么支持多线程？等等
• https 加密原理 ？主要是讲 对称加密 和 非对此加密 结合使用的一个过程。什么是 中间人攻击 ？和http区别？

4、Vue

• 生命周期？那个生命周期可以获取到 真实DOM ？ 修改data 里面的数据，会触发什么生命周期？
• 组件data为什么是一个 函数 ？
• vue 组件通信？一般说了 vuex ，就会问vuex用法？ action 和 mutations 区别？实现原理等？
• vue 导航守卫 ，分全局和组件的，一般用于权限控制，这个就可能扯到项目中的一些 鉴权问题 。
• $nextTick 作用？实现原理？微任务向宏任务的 降级处理 ，经常被问到说出几种宏任务，微任务。
• vue响应式原理 ？基本都会问
• vue scoped 属性作用？实现原理？
• vue router 有几种模式？实现方式？
• key 的作用？没有key的情况，vue会怎么做？会引出diff的问题
• vue diff过程 ，和react diff区别？
• vue 2.x defineProperty缺陷 ？业务代码里面怎么处理？ $set 原理？vue是怎么 重写数组方法 的？考察你是不是真的看过源码
• vue 3.0 proxy 优缺点？怎么处理vue3不支持IE？
• computed 和 watch 的区别和运用的场景？除了基本的，看你能不能说出 三种watcher 的区别

5、React

• 生命周期 详细描述一下？官方为什么 改变 ？
• 说说你对 虚拟DOM 的理解？直接全量更新和diff哪个快（这个问题要 分情况 ）？
• 什么是 HOC ？React里面用过哪些？可能让你实现一个 add(1)(2)(3) 的函数
• Fiber 干了什么事情？ requestIdleCallback 了解多少？
• react 性能优化？
• hooks 出现的意义？ 类组件 和 函数组件 之间的区别是什么？
• 为什么 不要在 循环、条件语句或者嵌套函数中 调用hooks ？记住官网的一句话， Not Magic, just Arrays
• setState 同步 还是 异步 ？比较常问，问的可能也比较深入
• 如何避免组件的 重新渲染 ？memo/useMemo、PureComponent？useMemo和useCallback区别？

6、其他

• 常用的一些模块， fs/path/http 等等
• EventEmitter 概念，使用场景，错误捕获
• Stream 概念？使用场景？常见的Stream？

webpack 基本也是必问，得系统学习一下

• webpack 构建流程 ？ 打包原理 ？
• 项目中做的一些 优化 ？
• loader 和 plugin 的区别？有没有写过？常用哪些loader和plugin
• webpack 热跟新 原理？
• tree-shaking ？对于 CommonJS，tree shaking怎么办？
• webpack loader的 执行顺序 ？从左到右？从上到下？

其他

• 项目做过的一些性能优化， 基本必问
• 长列表渲染 怎么优化？
• 各种 懒加载 的实现原理？路由？图片？
• Typescript 中的 interface 和 type 到底有什么区别
• 等等，很多 低频率 的想不起了

其他的一些东西，主要还是看你简历上 写了什么 ，或者你的 回答 有什么面试官感兴趣的词。尽量 突出 自己的 优势 ，发挥好就行，结果对自己的检验，不是对自己的否定，加油💪🏻

我把我面试遇到过的面试题以及刷到过的面试题做了一个整理，分了HTML、css、JavaScript、React、Vue、浏览器、服务端与网络、算法等等，共229页PDF。

完整版面试题资料免费分享，只需你点赞支持， 动动手指点击此处就可免费领取了 。

最后

不管你是否想要转行做前端，想做什么就全力以赴去做，不断学习，分享你的成长。

即使大多数人不看好你的决定，你也要坚持，用结果证明给他们看。