进入前端行业前明白个道理：程序员解决的问题，大多不是程序问题

关注

原创最新推荐文章于 2026-06-25 16:00:43 发布 8.1k 阅读 AI 写同款· GEO 优化 ›

想学编程？这些问题你搞明白了吗？最近有很多编程小白咨询我一些关于学习编程的问题，因为我也是自学编程，一路也是磕磕绊绊的，知道这里面的辛酸苦辣，对于他们的问题，我之前也迷茫过，姑且今天写写这方面的话题，希望对那些编程小白有所帮助！编程小白们注意啦！本篇文章，是庆哥专门为你们写的！觉得不错记得文末点赞哦，如果你能把你身边的朋友也忽悠过来关注我，好吧，庆哥承认你：是个人才???? 庆哥庆哥，学编程以后能干啥啊???? 你还别说，我当初... 阅读详情

前言

很多人都说，程序员很辛苦，与这个角色联系在一起的词儿，通常是忙碌、加班、熬夜等。作为程序员，我们将其看作一个值得全情投入的职业，希望能够把精力放在设计算法、改进设计、优化系统这些具有创造性与成就感的本职工作上。

但现实情况却是，许多人因为一些“意外”，陷入了无休止的忙碌，比如：

你辛辛苦苦写的代码还没上线，产品经理就告诉你需求变了；
你拼命加班只因错估了工作量，自己造的“孽”，含着泪也要搞定；
你累死累活做出来的东西和要求不符，只能从头再来；
你大面积地修改代码只是因为设计糟糕，无法适应新的需求变化；
……

诸如此类，不胜枚举。我们很辛苦，但耗费我们大量时间和精力去应付的工作，并不是技术工作，反而是这些看似很“不值当”的事儿。

为什么会这样？

在软件行业里有一本名著叫《人月神话》，其中提到两个非常重要的概念：本质复杂度（Essential Complexity）和偶然复杂度（Accident Complexity）。

简单来说，本质复杂度就是解决一个问题时，无论怎么做都必须要做的事，而偶然复杂度是因为选用的做事方法不当，而导致要多做的事。

比如你要做一个网站，网站的内容是你无论如何都要写的，这就是“本质复杂度”。而如果今天你还在用汇编写一个网站，效率是不可能高起来的，因为你选错了工具。这类选错方法或工具而引发的问题就是“偶然复杂度”。

这以至于我意识到一个事实：大部分程序员忙碌解决的问题，都不是程序问题，而是由偶然复杂度导致的问题。 换句话说，只要选择了正确的做事方法，减少偶然复杂度带来的工作量，就算是软件开发是可以有条不紊进行的。

不管是想转行做前端亦或者是毕业参加前端工作的小伙伴们，除了技术上的掌握，这方面的业务能力、问题解决能力也要加强。当然我们只有先面试通过了再去考虑这些问题，所以小编分享一份详细又全面的面试题，让你事半功倍。

小编分享的这个面试题资料涵盖了：HTML、CSS、JS、JQuery、数据请求相关问题、ES6、Vue、React、微信小程序、IOS/Andriod浏览器适配问题整理、Pc端兼容性问题、项目类问题、笔试编程题等，点击这就可以领取完整版PDF前端全面面试题资料喔。

HTML

Doctype的作用？
标准模式和怪异模式的区别：
行内元素/块级元素/空元素有哪些？
介绍一下你对浏览器内核的理解?
常用浏览器的内核有哪些？
浏览器是怎么对HTML5的离线储存资源进行管理和加载的？
描述一下cookies/sessionStorage和localStorage的区别?
HTML5新特性有哪些？如何处理HTML5新标签的兼容性问题？如何区分HTML和HTML5？
简述一下你对HTML语义化的理解?
HTML5离线缓存怎么使用，工作原理能不能解释一下？
页面导入样式时,使用link和@import有什么区别?
Iframe有哪些缺点?
Label的作用是什么?怎么用?
HTML5的form如何关闭自动完成功能?
如何实现浏览器内多个标签之间的通信?
页面可见性有哪些用途?(visibility API)
如何在页面上实现一个圆形的可点击区域?

CSS

☆浏览器盒模型?
☆清除浮动的方式
CSS选择器有哪些?哪些属性可以继承?
::after/:after与::before/:before的区别?
CSS样式优先级计算法:
☆CSS3新特性和伪类有哪些?
less的一些优势。
如何居中div?
Display有哪些哪些值?说明他们的作用
Position的值?
flex布局以及常用属性
请解释一下CSS3的flexbox(弹性盒布局模型),以及适用场景?
CSS打造三角形?
满屏品字布局?
li与li之间有看不见的空白间隙是什么原因引起来的?
为什么要初始化css样式?
CSS中的visibility属性的collapse[kə’læps]属性是干嘛的?
外边距合并是指的什么意思?
移动端的布局用过媒体查询吗?
响应式页面?
CSS预处理器(sass和less)用过吗?
使用CSS预处理的优缺点分别是什么？
CSS优化/提高性能的方法有哪些?
浏览器是怎么解析CSS选择器的?
Margin与padding的区别?
Css如何实现横向滚动与竖向滚动?
如何设置滚动条样式?
视觉差效果是如何实现的?
你对line-height如何理解?

JS

JS是一种什么样的语言?
JS数据类型有哪些?
介绍JS有哪些内置对象？
栈与堆的区别?
js中的作用域与变量声明提升
如何转化类型?
什么是面向对象编程及面向过程编程，他们的异同和优缺点
面向对象编程思想
如何解释this在js中起的作用?
js中this的用法（经典）：
☆说说JS原型和原型链
如何准确判断一个变量是数组类型?
☆call和apply的区别和作用?
继承的方法有哪些？
☆什么是闭包？闭包有什么作用？
事件代理（事件委托）:
事件的各个阶段
☆new操作符在创建实例的时候经历了哪几个阶段
异步编程的实现方式
对原生JS了解程度
js延迟加载的方法有哪些？
数组从小到大排序？
求从大到小排序可以先使数组从大到小排序,然后添加reverse()方法，使数组顺序颠倒

JQuery:

你觉得jQuery或zepto源码有哪些写的好的地方
jQuery的实现原理？
jQuery.fn的init方法返回的这指的是什么对象？为什么要返回这个？
jQuery.extend与jQuery.fn.extend的区别？
jQuery的属性拷贝（extend）的实现原理是什么，如何实现深拷贝？
JQuery的队列是如何实现的？队列可以用在哪些地方?
jQuery中的bind（），live（），delegate（），on（）的区别？
jQuery一个对象可以同时绑定多个事件，这是如何实现的？
针对jQuery的优化方法

数据请求相关问题

http请求方式有哪些？
http的状态码有哪些？分别说下它们的含义
请描述一下get与post的区别
get请求传参长度的误区
http和https有何区别？如何灵活使用？
什么是AJax?为什么使用Ajax?
简述ajax的过程。
Ajax优缺点？
XMLHttpRequest通用属性和方法
Ajax请求跨域接口，发送了几次请求？
跨域的几种方式
web应用从服务器端主动推送data大客户端有哪些方式?
如何实现浏览器内多个标签页之间的通信? (阿里)
webSocket如何兼容低浏览器？(阿里)
fetch、ajax、axios之间的详细区别以及优缺点：
为什么要用axios？
axios是什么？怎么使用？描述使用它实现登录功能的流程？
xml和json的区别？

ES6

列举常用的ES6特性：
箭头函数需要注意哪些地方？
箭头函数和普通函数之间的区别
let、const、var
拓展：var方式定义的变量有什么样的bug？
箭头函数this的指向。
手写ES6 class继承。
ES5的继承和ES6的继承有什么区别?
ES6 class 的new实例和ES5的new实例有什么区别?
generator生成器函数:
什么是async/await及其如何工作?
Promise和async await以及它们之间的区别:
async函数的基本用法:
async与generator的区别?
简单实现async/await中的async函数
有用过promise吗？请写出下列代码的执行结果，并写出你的理解思路

React

react的优势以及特点
React中的props和state的用法
react组件之间如何通信？
为什么虚拟DOM会提高性能？
react生命周期函数：
react性能优化是哪个周期函数？
在生命周期中的哪一步你应该发起AJAX请求？
概述一下REact中的事件处理逻辑
如何告诉React它应该编译生产环境版本？
调用setState之后发生了什么？
react的setState的原理及用法
setState为什么是异步的?
传入setState函数的第二个参数的作用是什么?
shouldComponentUpdate的作用是啥以及为何它这么重要？
createElement与cloneElement的区别是什么？
为什么我们需要使用React提供的Children API而不是JS的map？
React中的Element与Component的区别是？
在什么情况下你会优先选择使用class Component而不是functional Compone
React中refs的作用是什么？
React中keys的作用是什么？
diff算法？
React性能优化方案？
react怎么从虚拟dom中拿出真实dom

其他知识点面试题

Node的应用场景
谈谈你对webpack的看法
gulp是什么？
常见的web安全及防护原理
XSS原理及防范方法
CSRF的原理及防御
XSS与CSRF两种跨站攻击
common.js AMD CMD的区别
ES6模块有CommonJS模块的差异
网页验证码是干嘛的，是为了解决什么安全问题
webpack的原理
webpack的loader和plugin的区别？
怎么使用webpack对项目进行优化?
防抖、节流
浏览器的缓存机制
描述一下二叉树, 并说明二叉树的几种遍历方式?

篇幅有限原因，还有Vue、微信小程序、IOS/Andriod浏览器适配问题整理、项目类问题、笔试编程题等面试题没有列举出来，需要完整版PDF前端全面面试题资料的小伙伴们，请直接点击这里领取资料哦。