学习路线
HTML基础
HTML是页面中内容的载体，可以展示开发者想要用户浏览的任何文字、图片、音频信息。对于HTML的各类标签，不仅要掌握日常开发中经常碰到的，也要慢慢积累那些不常用标签，块级、行内元素的定义以及二者相互转换几乎是每场技术一面常考问题。
- 浏览器页面有哪三层构成，分别是什么，作用是什么?
- HTML5的优点与缺点？
- Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
- HTML5有哪些新特性、移除了哪些元素？
- 你做的网页在哪些浏览器测试过,这些浏览器的内核分别是什么?
- 每个HTML文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗？
- 说说你对HTML5认识?（是什么,为什么）
- 对WEB标准以及W3C的理解与认识?
- HTML5行内元素有哪些,块级元素有哪些, 空元素有哪些?
- 什么是WebGL,它有什么优点?
- 请你描述一下 cookies，sessionStorage 和 localStorage 的区别?
- 说说你对HTML语义化的理解?
- link和@import的区别?
- 说说你对SVG理解?
- HTML全局属性(global attribute)有哪些?
- 说说超链接target属性的取值和作用？
- data-属性的作用是什么？
- 介绍一下你对浏览器内核的理解？
- 常见的浏览器内核有哪些？
- iframe有那些缺点？
- Label的作用是什么，是怎么用的？
- 如何实现浏览器内多个标签页之间的通信?
- 如何在页面上实现一个圆形的可点击区域？
- title与h3的区别、b与strong的区别、i与em的区别？
- 实现不使用 border 画出1px高的线，在不同浏览器的标准模式与怪异模式下都能保持一致的效果？
CSS基础
在校招准备时，掌握CSS各类常用的属性是必要的，其中浮动、清除浮动以及定位更是必考点。CSS盒模型，CSS各类选择器也是面试官常考问题，各个选择器优先级顺序、多个选择器组合时优先级比重的计算都是必须要掌握的。
- 解释一下CSS的盒子模型？
- 请你说说CSS选择器的类型有哪些，并举几个例子说明其用法？
- 请你说说CSS有什么特殊性?（优先级、计算特殊值）
- 要动态改变层中内容可以使用的方法？
- 常见浏览器兼容性问题与解决方案？
- 列出display的值并说明他们的作用？
- 如何居中div, 如何居中一个浮动元素?
- CSS中 link 和@import 的区别是？
- 请列举几种清除浮动的方法(至少两种)?
- block，inline和inlinke-block细节对比？
- 什么叫优雅降级和渐进增强？
- 说说浮动元素会引起的问题和你的解决办法
- 你有哪些性能优化的方法？
- 为什么要初始化CSS样式？
- 解释下浮动和它的工作原理？清除浮动的技巧？
- CSS样式表根据所在网页的位置，可分为哪几种样式表？
- 谈谈你对CSS中刻度的认识？
- 请你说说em与rem的区别？
- 请你说说box-sizing属性的的用法？
- 浏览器标准模式和怪异模式之间的区别是什么？
- 怪异Quirks模式是什么，它和标准Standards模式有什么区别？
- 说说你对边距折叠的理解?
- 内联与块级标签有何区别？
- 说说隐藏元素的方式有哪些？
- 为什么重置浏览器默认样式，如何重置默浏览器认样式？
- 谈谈你对BFC与IFC的理解？(是什么，如何产生，作用)
- 说说你对页面中使用定位(position)的理解？
- 如何解决多个元素重叠问题？
- 页面布局的方式有哪些？
- overflow :hidden是否形成新的块级格式化上下文？
JavaScript
JavaScript主要是为Web页面添加交互行为，基础知识超高频考点有数据类型以及判断方法、闭包、块级作用域、函数提升与变量提升、原型链、JS继承、变量深浅拷贝等等，除此之外还有很多零碎知识点都是前端开发必须掌握的。
-
原型链
(1) 创建对象有几种方法？
(2) instanceof的原理？ -
类
(1) 类的声明？
(2) 生成实例？声明一个类，怎么生成类的实例？ -
继承
(1) call、apply的共同点与区别?
(2) 用javascript实现对象的继承/ 继
戳这里领取完整开源项目：【一线大厂前端面试题解析+核心总结学习笔记+Web真实项目实战+最新讲解视频】
承的几种方式，这几种方式的优缺点?
-
作用域
(1) 说说你对作用域链的理解？
(2) this？ -
JS闭包
(1) 闭包的特征？
(2) 闭包应用场景？
(3) 实际开发中闭包的应用？ -
JS运行机制，单线程，异步
(1) 如何理解js的单线程？
(2) js为什么是单线程的？
(3) 同步和异步的区别是什么？分别举一个同步和异步的例子？
(4) 何时需要异步？
(5) 什么是任务队列？
(6) 请说出下列的值？
(7) 栈和队列的区别？
(8) 栈和堆的区别？
(9) 什么是event loop？
(10) event-loop流程？
(11) 哪些语句会放入异步任务队列中？
(12) 何时被放入任务队列？ -
JS数据类型
(1) js使用typeof能得到的哪些类型？
(2) 如何准确判断一个变量是数组类型？
(3) js变量按照存储方式区分为哪些类型，并描述其特点？
(4) null和undefined的区别？
(5) undefined的典型用法？
(6) null的典型用法？
(7) chrome60+浏览器中,a===b的是哪项？ -
JS的内置函数，内置对象
(1) js中有哪些内置函数/ 数据封装类对象？
(2) js中有哪些内置对象？
(3) js变量按照存储方式区分为哪些类型，并描述其特点？
(4) 字符串方法/ String对象方法?
(5) 数组方法/ Array对象方法？
(6) 数组API？
(7) 对象API？ -
数组去重
(1) 数组怎么去重？
(2) 对上述数组去重方法速度比较？
(3) 一句话数组去重？
(4) 保留数组中非重复元素？
(5) 保留数组中重复元素？ -
内存泄露
(1) 哪些操作会造成内存泄漏？
(2) js内存泄漏的解决方式 -
DOM
(1) dom是哪种基本的数据结构？
(2) dom操作的常用api有哪些？
(3) dom节点的attribute和property有何区别？
(4) dom结构操作/ 怎样添加、移除、移动、复制、创建和查找节点/ dom操作的
常用api？
(5) dom事件的级别？
(6) dom事件模型？
(7) dom事件流？
(8) 描述dom事件捕获的具体流程？
(9) event对象的常见应用？
(10) 自定义事件/ 模拟事件？
(11) 通用事件绑定/ 编写一个通用的事件监听函数？
(12) dom树、render树的关系/ dom树、render树的区别（第2、3条）？ -
BOM
(1) bom常用属性？ -
通信
(1) 什么是同源策略及限制？
(2) 前后端如何通信？
(3) 跨域通信的几种方式？
(4) jsonp实现？
(5) 可以跨域的三个标签？
(6) 三个可跨域的标签的使用场景？ -
Ajax
(1) ajax请求的原理/ 手写一个ajax请求？
(2) readyState？
(3) ajax异步与同步的区别？
(4) ajax传递中文用什么方法？ -
错误监控
(1) 前端错误的分类/ 如何检测js错误/ 如何保证你的产品质量？
(2) 错误的捕获方式？
(3) 上报错误的基本原理？ -
模块化
(1) amd、cmd区别？
(2) amd、***monJs区别？ -
虚拟DOM
(1) vdom的如何应用，核心api是什么？
(2) 虚拟dom转换成真实dom？
(3) diff实现过程？
浏览器相关
页面在浏览器中显示时，浏览器针对页面中的HTML、CSS、JS代码，以及各类图片、音频资源有特定的渲染机制，同时页面资源请求是通过浏览器代为执行的，出于安全考虑，浏览器制定了同源策略，当请求方与目的地不同源则需要跨域请求资源，约有5-6种跨域方案，实现原理不同，也有不同方面的优缺点，此类问题几乎是笔试中问答题的必考题。
- 浏览器存储的方式有哪些
- 浏览器内核的理解
- HTTP 的请求方式场景
- HTTP状态码
- 从浏览器地址栏输入URL后发生了什么？
- 请你谈谈Cookie的优缺点
- cookies ， sessionStorage 和 localStorage 的区别
- 浏览器缓存
- 浏览器渲染的步骤
- GET 和 POST 请求的区别
- 什么是reflow
- 什么时候会导致reflow发生呢？
- 减少reflow对性能的影响
框架相关
原生JS虽能实现绝大部分功能，但要么就是过于繁琐，要么就是存在缺陷，故绝大多数开发者都会首选框架开发方案。现阶段较热门是React、Vue两大框架，两者工作原理上存在共通点，也存在一些不同点，对于校招来说，不需要两个框架都学得特别熟，一般面试官会针对你简历中写的框架进行提问。
在框架方面，生命周期、钩子函数、虚拟DOM这些基本知识是必须要掌握的，在学习的过程可以结合框架的官方文档
Vue框架
知识要点：
1. vue-cli工程
2. vue核心知识点
3. vue-router
4. vuex
5. http请求
6. UI样式
7. 常用功能
8. MVVM设计模式
React框架
知识要点：
1. 基本知识
2. React 组件
3. React Redux
4. React 路由
计算机网络
网络技术是前端页面数据交互的桥梁，在前端岗的校招中，除了前端方面的知识以外，计算机网络方面算是第二大重点了。
其中较为常考的主要有：OSI七层模型、各层中的传输协议、TCP/UDP区别、TCP三次握手四次挥手、HTTP/HTTPS区别、HTTP各版本、HTTP报文结构等等。这类知识比较枯燥繁琐，在学的时候可以通过画图来加强记忆。
- TCP 建立连接的三次握手过程
- cdn 原理
- HTTP 的头部包含哪些内容。常见的请求方法（我为什么要 说后面的 options，head，connect）
- 请求方法 head 特性
- HTTP 状态码，301和302 有什么具体区别，200 和 304 的 区别
- OSI 七层模型
- TCP 和 UDP 的区别，为什么三次握手四次挥手
- HTTP 缓存机制
- websocket 和 ajax 的区别是什么，websocket 的应用场景有哪些
- TCP/IP 的网络模型
- 知道什么跨域方式吗，jsonp 具体流程是什么，如何实现 原生 Jsonp 封装，优化，对于 CORS，服务器怎么判断它该不 该跨域呢
- 怎么生成 token，怎么传递
- 操作系统进程和线程的区别
- 什么是进程线程
- 线程的那些资源共享，那些资源不共享
- 操作系统里面进程和线程的区别
- Linux 查询进程指令，查询端口，杀进程
- 进程间的通信方式有哪些？
数据结构与算法
这一块在笔试、面试的代码题中考核较多，其中常考的数据结构主要有：数组、链表、队列、栈、Set、Map、哈希表等，不同数据结构有不同的方法以及储存原理，这些算是技术岗的必备知识。算法部分主要分为两大块，排序算法与一些其他算法题。
排序算法根据考频高低主要有：快速排序、归并排序、堆排序、冒泡排序、插入排序、选择排序、希尔排序、桶排序、基数排序、Timsort这十种，这类考核点要么是算法的时间、空间复杂度、稳定度，要么是直接手写代码，故在理解算法原理的同时，对JS语言版的排序算法代码也要加强记忆。
- 二叉树层序遍历
- B 树的特性，B 树和 B+树的区别
- 尾递归
- 如何写一个大数阶乘？递归的方法会出现什么问题？
- 把多维数组变成一维数组的方法
- 知道的排序算法 说一下冒泡快排的原理
- Heap 排序方法的原理？复杂度？
- 几种常见的排序算法，手写
- 数组的去重，尽可能写出多个方法
- 如果有一个大的数组，都是整型，怎么找出最大的前 10 个数
- 知道数据结构里面的常见的数据结构
- 找出数组中第 k 大的数组出现多少次，比如数组【1，2， 4，4，3，5】第二大的数字是 4，出现两次，所以返回 2
- 合并两个有序数组
- 给一个数，去一个已经排好序的数组中寻找这个数的位 置（通过快速查找，二分查找）
最后
其实前端开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。
这里再分享一个复习的路线：（以下体系的复习资料是我从各路大佬收集整理好的）
《前端开发四大模块核心知识笔记》
最后，说个题外话，我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
先看看自己复习到了哪个阶段就好。
这里再分享一个复习的路线：（以下体系的复习资料是我从各路大佬收集整理好的）
《前端开发四大模块核心知识笔记》
最后，说个题外话，我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在IT学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。
