下列出提纲不懂大家网上查查，答案非常多，都是来自网上收集哈，供大家一起学习，混口饭吃。
模块一 HTML
- 环境搭建 Chrome + VSCode + liveserver
- 标签的使用场景
- 常见HTML5标签 header section，article
- doctype、meta、常见属性
- 各种表单类型
模块二 CSS重难点
- CSS选择器种类、权重、优先级计算、匹配顺序、继承( ID选择器 > 类选择器 > 元素选择器 > 通配选择器)
- 块、行的特性 (块占一行，行是相邻元素)
- 两种盒模模型(标准盒子与ie盒子，ie margin 不计入，box-sizing 可以选择类型)
- 边距折叠 （inline-block ,padding,border来制造间隙，以防止margin折叠）
- Flex布局做页面，flex-basis、flex-grow、flex-shrink的计算方法
- BFC的概念和应用（前端BFC是指“块级格式化上下文”，实现 display属性，overflow属性，float属性，clear属性）
- 定位各种用法
- 层叠上下文
- Grid布局的使用
- 垂直、水平居中的几种实现
- 响应式媒体查询
- 移动端适配动态rem、动态viewport
- 字体图标、svg图标
- CSS3常见特效如圆角、阴影、形变、过渡、动画
模块三 ECMAScript
- 8种数据类型 (Number、String、Boolean、undefined、object、Null ，Symbol ，bigInt)
- var、let、const 区别
- 布尔与falsy值
- 类型转换
- 基础类型和引用类型
- 常见运算符（+、+=、==、===、&&、||）
- typeof 的值
- 运算符结合性和优先级
- 流程控制语句
- 字符串操作
- 0.1 + 0.2 === 0.3与大数相加
- 数组操作API
- 对象操作
- Map、weakMap、Set、Symbol
- Math、Date
- 函数、箭头函数、递归
- 深拷贝
- 词法作用域、立即执行函数表达式
- 柯里化、回调函数
- 正则表达式
- ES6常用语法
模块四 ECMAScript重难点
- 构造函数、对象、原型，原型链
- Class写法
- 继承的实现
- this、call、apply、bind
- 闭包
- 回调函数，Promise封装、async、await的使用
- 手写Promise.all、Promise.race、Promise.allSettled、Promise.any
- 手写Promise并发控制
- 任务队列宏任务与微任务，setTimeout、Promise、async、await相关代码输出
- v8垃圾回收
模块五 DOM
- DOM的获取、创建、删除、修改内容
- 属性的操作、JS修改样式、切换class控制样式
- onclick与addEventListener，事件模型、冒泡与捕获、事件代理、阻止默认
模块六 BOM
- localStorage、Cookie、Session、SessionStorage 区别
- navigator判断设备
- history、pushState、replaceState，不改变url刷新页面
模块七 前后端交互
- 手写node server
- Ajax 的使用与Promsie封装
- Fetch API的使用
- Axios介绍
- Mock.js和常见Mock平台
- WebSocket
- 同源策略、跨域方案、CORS、JSONP
模块八 浏览器渲染机制
- DNS解析过程
- 浏览器渲染机制
- 加载JS、CSS区别和放置位置原因
- 重绘、回流概念，和性能优化的关系
- script的asnyc和defer
模块九 模块化、项目构建
- Node.js之CommonJS规范
- Node.js之npm、yarn、package.json、node_modules
- ES6 Module
- Webpack的日常使用、配置
- 常见Loader、Plugin
- 手写Webpack Plugin、Loader
- Webpack的构建流程
- Webpack优化前端的手段
- 认识rollup
拓展提升
模块十 HTTP与Web安全
- TCP三次握手和四次挥手过程
- TCP与UDP区别?TCP 协议怎么保证可靠的，UDP 为什么不可靠？应用场景?
- 滑动窗口、拥塞控制
- GET和 POST的区别
- HTTP状态码有哪些，301和302有什么区别
- 浏览器HTTP请求数目限制，怎么解决
- 长链接、短链接、如何断开长链接
- HTTP 1.0&1.1&2区别
- HTTP2特性
- HTTP2如何加密
- 缓存的处理过程？强缓存/弱缓存？请求头字段和响应头字段，如何设置不用缓存
- HTTP和HTTPS有什么区别
- HTTPS加密过程、证书是什么
- Web安全之HTTPS、XSS、CSRF
- 登录鉴权有哪些方式？登录持久化怎么实现的?
- JWT，accesstoken、refresh token的作用分别是什么，存放在哪儿，具体流程？
模块十一 性能优化
- 性能优化怎么做的（结合资源和代码压缩优化、图片/路由/组件懒加载或者分包、CDN、SSR，HTTP2、浏览器加载和渲染、动画体验等）
- CDN原理？CDN优化时如何判断该将哪些包分离
- 前端性能衡量指标
模块十二 移动端
- px、em、rem、vw、rpx区别
- 物理像素、逻辑像素、PPI、设备像素比是什么
- 布局视口、视觉视口是什么？meta viewport的设置逻辑
- viewport缩放适配与动态rem适配原理
- 在项目中使用postcss-pxtorem
- 实现0.5px细线
- 移动端响应式高清图片解决方案
模块十三 设计模式
- 面向对象与组件
- 模块模式
- 单例模式
- 工厂模式
- 桥接模式
- 观察者模式
- 以轮播为例讲解设计模式的优势
模块十四 TypeScript学习
- 体验TypeScript
- 类型v.s.类
- 类型的两个好处
- TS支持的JS类型
- TS中的any、unknown、void、never、enum、tuple
- 如何给不同数据加type
- 联合类型与区分联合类型
- 交叉类型
- 怎么声明div的类型
- 泛型是什么
- 泛型的实际使用
- 重载
- 如何用泛型封装网络请求库
模块十五 Node.js 重难点
- Node.js 技术架构总结
- Node.js 命令行翻译项目
- 在Node.js项目中使用TypeScript
- 发布NPM
- Node.js API 与学习方案
- WebStorm&VSCode&Chrome 调试 Node.js
- libuv & v8 的功能
- EventLoop 介绍
- Docker 和 MySQL
- Node.js 连接数据库
- ORM 之 Sequalize
- 一对一、一对多、多对多表设计
- 缓存字段、事务、存储引擎 InnoDB
- 三个例子了解 Stream
- 创建自己的流
- 进程、阻塞进程、线程
- 创建进程和操作线程
- Node.js 的 execFile、spawn 和 fork
模块十六 手写代码
- 用Set去重、不用Set如何去重、在原数组上去重
- 如何对数组里有相同内容的对象去重
- 如何按数组里包含的对象属性字段去重
- 数组里的对象包含数组摘录字段构成新数组
- 手写深拷贝、处理循环引用的深拷贝
- 手写一个trim函数
- 手写一个curry函数
- 写一个观察者EventBus含emit、on、once、off
- 手写一个 instanceof
- 手写一个new
- 手写一个call和apply
- 用call/apply实现bind
- 不用call或者apply实现bind
- 手写bind考虑new一个bind函数的情况
- 手写防抖debounce
- 手写节流throttle
- 手写forEach、map、filter、reduce
- 手写数组拍平flat
- 手写原型继承
- 手写class继承
- 实现字符串大数相加
- 手写lazyman函数
模块十七 手写代码
- Promise封装一个Ajax函数
- Promise封装一个delay函数
- 手写Promise.all
- 手写Promise.race
- 手写Promise.allSettled
- 手写Promise.any
- 手写并发控制
- 宏任务、微任务原理和执行输出顺序
- async、await微任务代码执行输出顺序
- Promise链式调用与错误处理代码输出
- 闭包代码输出分析
- this代码输出分析
- 手写reactive函数 实现track 和 trigger，分别使用Object.defineProperty 和 Proxy
