前端面试考点总结

目录如下：

一、HTML和CSS [https://github.com/Laighten/JavaScript-Notes/前端面试考点总结/一、HTML和CSS.md]

1、布局-盒模型

• 计算盒模型的宽度

• margin纵向重叠的问题

• margin负值的问题

2、布局-BFC

• BFC的理解和应用

• 形成条件

3、布局-float

• 双飞翼布局和圣杯布局

• 手写双飞翼布局

• 手写圣杯布局

• 手写clearfix

5、布局-flex

• 基础知识

• flex实现三点骰子

6、定位

• absolute和relative

• 居中对齐的实现方式

7、图文样式

8、移动端响应式

• rem

• vm/vh

9、动画/渐变

• CSS3动画

二、ES [https://github.com/Laighten/JavaScript-Notes/前端面试考点总结/二、ES.md]

1、函数式编程思想

2、值类型和引用类型

• 五大基本类型：

• 引用类型：

• null和undefined的区别

• 类型转换

3、类型判断

• instanceof

• typeof

• ===和==

4、深拷贝和浅拷贝

• 浅拷贝的实现方法：

• 深拷贝的实现方法：

• 递归实现深拷贝：

5、原型和原型链

6、作用域和闭包

• 作用域

• 闭包

7、继承

• ES5的继承

• ES6的继承

8、this

• 改变this指向的方法

• 如何判断this的指向

9、new一个对象的过程

10、异步和单线程

11、Callback hell和Promise

• Promise

12、async/await

• async/await和Promise的关系

13、宏任务/微任务

• 什么是宏任务/微任务

• 相关面试题

14、event-loop

• JS的执行过程

• 浏览器中的event loop

• NodeJs中的Event Loop机制

15、模块化

• ES6模块化

• CommonJS模块化

三、Web API

1、DOM

• 获取DOM节点

• attribute

• property

• 总结

• 结构操作

• DOM性能

2、BOM

• navigator/screen

• location/history

3、Ajax

• 手写一个Ajax请求

• 状态值

• 同源策略

• 跨域

4、事件绑定

5、事件冒泡

6、事件代理

7、存储

• cookie

• localStorage和sessionStorage

四、开发环境

1、git

• 常用命令：

2、调试

• chrome调试工具：

• 抓包工具：

3、webpack和babel

• webpack：

• babel：

4、linux命令

五、运行环境

1、加载和渲染

• 网页加载过程

• 渲染页面的过程

• onload与DOMContentloaded

2、性能优化

• 加载资源优化

• 渲染优化

• 懒加载

• SSR

• 手写防抖

• 手写节流

3、安全

• XSS（跨站请求攻击）

• CSRF（跨站请求伪造）

六、HTTP 协议

1、常用的状态码

2、HTTP1.0、HTTP2.0和HTTP3.0

3、TCP

• 三次握手

• 四次挥手

4、methods

• 传统的methods：

• 现在的methods：

5、Restful API

6、Http headers

• Request Headers:

• Response Headers：

7、缓存

• 缓存介绍

• 强制缓存：

• 协商缓存（也叫对比缓存）：

• 刷新对缓存的影响

详细内容请移步：https://github.com/Laighten/JavaScript-Notes