2024 web 前端面试总结（内附面经）-CSDN博客

本文链接：https://blog.csdn.net/2401_84150154/article/details/138640963

var a = 0;

function add1(){

return a++;

}

没错，我就是这么写的，今年 4 月的时候。所以也应该大概知道我当时的水平吧。

之所以说这些呢，是给大家打个气，菜没关系，但是不能一直菜。所以也是告诉大家，如果真想学好，并且有兴趣的话是可以学好的。先说一下我准备的过程吧，给大家做个参考。

准备过程

大概就是实习结束之后就开始准备了。因为那时还有课，实验室还有项目，所以复习的比较慢，花了大概两个月左右把红宝书看了第一遍，基本上每一章都看了。这个过程虽然记住的东西不多，而且很多东西可能理解不了，但是会让你多很多东西有个基本的概念。为第二遍做准备。没错，这本书看一遍远远不够，你还要看第二遍，而且要整理，最重要的是复习。我相信看一遍的人很多，看第二遍的人也有。但是看的时候整理并且经常复习的人可能并没有那么多。当然第二遍整理的时候你需要有复习的思路（后面我会提供给大家，可以做个参考）。第二遍的时候不能有不理解的地方了，原型，继承，原型链，执行上下文，垃圾回收，作用域链书上讲的不清楚，看不懂的去网上找，还是不懂自己用例子测试。第二遍一定要弄懂，除非你想来第三遍。第二遍的话总结只总结重点的几章我就整理了九万多字，并且那段时间每天早上都会复习一下，8 点复习，9 点左右结束，其实有点太多了。导致自己都快背下来了。后来的话感觉每天把前一天整理的复习一下，每个星期把所有的复习一下可能更合适一些，也有更多时间看别的。

那段时间除了看这个的话还在看 vue 和 webpack，ES6 标准入门，图解 http（稍微翻了一下 http 权威指南）。后来因为感觉自己一个跨专业的基础比较差，所以还是把精力放在基础上比较好，就暂时把 vue 和 webpack 放下了。开始看你不知道的 JavaScript。ES6 标准入门的话也不用都看，也是要有重点的看，当然这些都是针对找工作来说的。还是一样的，总结和复习缺一不可。

后面的话开始看你不知道的 JavaScript，解决了我对于 this 指向的疑惑，刚开始的话看上中两卷就好，后面有时间可以再看下。

然后提前批就开始了。因为自己本身算跨专业，加上没有实习，学习的时间不长，所以从开始的时候就积极投简历了。不管是什么岗位，我都建议提前批开始投递简历，当然，是在我前面说的那些准备工作都做的差不多的情况下。如果你什么都没做，我觉得可能安心复习是更好的选择。

开始面试以后，肯定有好多东西不会，可以通过写面经，总结的方式来弥补自己的缺陷，不能面完了就结束了。这样同样的问题你永远不会。比如刚开始我对 BFC，防抖节流，性能优化等根本不了解，后面的话也通过面试，面试完查资料了解了。这里想说的就是不懂就要问，要查，而不是过。

后面的话自己了解的东西就比较多了，高性能 js，js 忍者秘籍，前几天的话也是刚看完 js 函数式编程，最近又把 http 抓包实战看完了，了解了抓包相关的东西。

前面的话是自己复习的一些经历。里面对框架说的比较少，这里说一下原因。首先我是跨专业的，基础差，基础都没打好怎么看框架。比如你让一个会用 jquery 的 ajax 的人封装一个原生的 ajax，可能他们不会，但是我会。所以框架固然重要，但是基础是最重要的。当然框架里面的一些好的思想你还是要了解的。比如虚拟 dom，diff 算法，vue 双向绑定实现这些东西。你可以没用过框架，但是这里面的原理你需要花时间去了解。

复习思路

下面是我从开始找工作时整理的一些面经，大家可以参考一下。

2018 秋招前端面试总结

有些可能没有，因为现场面的时候是连着面的，所以没有整理的时间，回去的时候都忘的差不多了，而且大多数都是类似的问题，可能少数几个不一样，也不值得整理了。所以有些可能没有。

其实开始复习之前也整理过别人的面经，大致都差不多。我这里就不提供具体的问题了，因为有好多人整理过了，所以可以参考他们。但是你在看别人整理的内容之前，最好自己已经了解一部分了。因为别人整理的东西为了简洁可能会把一些帮助理解的东西去掉，所以相当于你看到的只是结论。你看别人整理的东西的时候，最好是用来查缺补漏，而不是用来学习。

JavaScript 基础

重点 js 高级程序设计 3 - 7 章，10 - 13 章，21 章

首先，基础知识一定要扎实。怎么样算扎实呢，举个例子吧，每个对象都有的 tostring 和 valueOf，谁能说出什么情况下触发哪一个

var obj = {}

console.log(obj);

console.log(+obj);

console.log(obj=={});

console.log(obj==={})

console.log(obj==‘test’)

console.log(obj===‘test’)

很多人只是过了一下，就比如别人整理的东西上面肯定不会说的特别详细，他只是给你个结论，所以你亲自试过吗？怎么试呢，其实很简单啊

var obj = {

toString:function(){

console.log(‘toString’)

return Object.prototype.toString.call(this)

valueOf:function(){

console.log(‘valueOf’)

return Object.prototype.valueOf.call(this)

}

alert(obj);

alert(+obj);

alert(obj=={});

alert(obj==={})

alert(obj==‘test’)

alert(obj===‘test’)

很简单就能测试出来什么时候用 valueOf 和 toString 了。

再比如数组哪些方法会改变原数组，哪些不会。其实这些书上都有，但是没有专门总结。因为总结不是书的事，书只负责教你知识，总结是你自己的事。一辈子不总结，一辈子都记不清。因为我也是从这种状态走过来的，所以希望大家学完一点东西以后总结一下，过段时间看一下。

如果你这两个都想的磕磕绊绊可能得看一下基础部分的内容。

网络

重点图解 http，极客时间的趣谈网络协议，博客

基础差不多了，还要看网络的东西，如果做开发的话，前后台都需要好好了解网络的知识。具体有 http，http 2.0，https，dns，cdn，tcp，缓存，跨域，安全，本地存储这些东西。前面那些计算机网络的东西可以通过图解 http 来做个大概的了解。这里想推荐极客时间的一门课程趣谈网络协议。如果有想试听的可以加我微信，通过我的链接购买的返利我也会返还给你，微信和链接放在最后。因为我之前也是特别头疼网络这方面的东西，不过听了以后就感觉好多了，甚至还能说下 quic 协议来装个逼。每天早上，中午晚上去学校实验室的路上听一下，反复听，这点东西听一个月就算弱智也能听会了。当然也要自己总结一下，因为有些讲的不是那么清楚，比如 https 的 pre-matser 那里，这就需要你自己去查一下。对于跨域，缓存，安全这些东西网上一找一大堆，我自己也整理过，所以也不是特别难，可能刚开始了解的不多，会觉得好难，其实看下来以后会觉得没那么难。这里特别要注意的就是 cookie 的一些属性，需要记一下。

html 和 css

css 权威指南 2、3、7、8、10 章，w3c，博客

html 首先要理解语义化，然后就是一些语义化的标签。语义化的好处，新增的一些特性。给你一个页面结构要能使用语义化标签准确还原。

css 这部分的话其实考的比较多的是一些实际的东西，但是首先基础你要知道。比如最基本的盒模型，还有一些 css3 新增的选择器，属性等。然后最经常的就是让你实现三栏两栏布局，所以基本的布局方式你也要了解吧。然后就是垂直居中，移动端适配等考的比较多。这些东西其实都是需要自己整理，然后一段时间复习一下。