携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第19天，点击查看活动详情

前言

众所周知，前端需要掌握的知识非常杂，知识点涉及的也很广，本文我们讲一下前端知识体系基本部分的重要知识点，javascript、html、css、网络、浏览器相关知识，帮助大家进行查缺补漏。

大前端 - 基础

类型
- 基本类型(symbol，BitInt)
- 引用类型
- 操作符
Object
- 其他对象的基类/方法/构造函数（比如Object.defineProperty、Object.getPrototypeof）
Array
- 类数组/遍历方法/构造函数（比如Array.isArray/Array.from/Array.of）
ES6相关
- 箭头函数（与普通函数的区别）
- promise原理、promise几个方法区别（all、allSettled、race、any）
- Set、Map、WeakSet 和 WeakMap 的区别
- 其他新特性（Proxy/Reflect、symbol）
闭包（表现形式、用途、缺点）/作用域（概念）/this（隐式绑定、绑定优先级）
原型链（是什么？有哪些特点）
OOP
- 继承（es5的几种实现方式）
- 设计模式（构造函数、原型模式、工厂模式）
- 手动实现一个new
异步
- 异步编程的方式
- eventloop
- 宏任务与微任务
其他
- 事件（事件委托、事件冒泡、事件模型）
- ajax与fetch区别
- 深浅拷贝相关

html5新标签（语义化）
盒模型、css盒模型
html5概念
- 声明
- 存储 (localStorage、sessionStorage)
- 属性（websocket）
- 其他特性（document.querySelector、geolocation）

浏览器渲染页面的过程
- 网络层（构建请求、查找强缓存、dns解析、建立TCP链接、发送http请求、网络响应）
- 解析算法（构建dom树、样式计算、生成布局树）
- 渲染过程（建图层树、生成绘制列表、生成图块和生成位图、显示器显示内容）
- 断开连接（TCP四次挥手）
回流和重绘
- 概念及优化
首屏加载优化
- 体积优化
- 网络优化
- 感知优化
浏览器本地存储
- cookie
- sessionStorage/localStorage
- IndexDB
跨域通信
- 跨域的原因、了解什么是同源策略
- CORS、nginx、jsonp、postMessage、websocket、node中间件
前端异常处理及前端监控(错误处理与调试)
- 前端监控（用户行为、异常监控、性能监控）
- 错误上报方式（GIF上报错误）
- 捕获错误（window.onerror、try-catch、promise-catch、iframe、MVVM框架错误）
- 崩溃和卡顿
  - window对象的load和beforeunload事件实现了网页崩溃的监控。
  - 使用Service Worker来实现网页崩溃的监控
  - performance.now() + requestAnimationFrame代码判断
- 第三方工具（sentry）

本文介绍了前端的基础部分的重要知识点，也是面试经常会问到的，给大家进行一个梳理和总结，包含了javascript、html、css、网络、浏览器等相关知识，也是我认为一个初级前端需要掌握的内容。