素材编辑 | 宋大狮
排版运营 | 小唐狮
ONE 问题描述
今天要和大家分享的是关于前端知识体系的问题，主要是个人在前端领域学习和工作这么长时间以来，因为很少细致的去归纳前端的知识体系，而只会大致的了解前端技术栈的相关知识点，用最短的时间去掌握并应用于工作，导致个人现在感觉十分迷茫，整个学习计划非常不清晰。甚者，时间一长的话，还总是会遗忘，必须要快速重新学习某一个知识点来应对工作，久而久之，就会导致之前的学过得东西十分混乱，没有一个有条理的体系，总的来讲就是十分的低效。于是今天就想着用最少的文字，来记录一下这个问题，希望能够帮助到有同感的朋友。
需求： 针对前端小白，需要考虑学习成本，以求最快速的入门职场所需要的前端技术点。针对前端已工作的朋友，需要考虑技术点的重要性和全面性，以求最快速的复习巩固重要技术点，及补充学习之前初学时所落下的知识点。
问题： 梳理前端知识体系。
TWO 知识体系
写在最前面：前端知识体系仅为主流和重点，并不全面，仅供快速学习参考，后期会做全面补充
一：基础三大件 HTML+CSS+JS
1、HTML：
认识各种标签 H5新特性
2、CSS：
选择器
盒模型
浮动
定位
CSS3新特性
3、JS：
流程控制语句
函数
数组 字符串
DOM
事件
BOM
JSON
面向对象
动画
正则表达式
Ajax
ES6新特性
备注： JQuery根据公司需要学习，如不需要可暂时不用学习，此处暂不议，后续会做补充。
二：框架 Vue2
1、内置指令
v-bind v-on
v-if v-show
v-for v-model
v-html v-text
2、配置项
computed计算属性 watch监听器 filters过滤器 directives自定义指令
3、生命周期
created mounted
beforeDestroy
4、组件
组件通信方式： 父传子、子传父 祖传孙、孙传祖 兄弟间
5、路由管理
vue-router 路由跳转方式 路由传参方式
6、状态管理
Vuex 五种状态 工作流程
7、请求管理
Axios 二次封装
8、Vue2响应式原理
备注： 三大框架中Angular和React根据公司需要学习，如不需要可暂时不用学习，此处暂不议，后续会做补充。
三：Uni
1、事件
事件绑定
事件传参
事件对象参数
事件数据处理
2、页面跳转
跳转方式 传参方式
接收参数
3、页面渲染
标签
显示隐藏
遍历
4、请求接口
备注： Uni语法类同Vue，学习时重点关注两者区别。原生微信小程序开发、原生APP开发根据公司需要学习，如不需要可暂时不用学习，此处暂不议，后续会做补充。
四：其它
版本管理工具：
Git的使用
写在此处分割线：线上为工作必学，线下为选学
五：Vue3 + Ts
1、Ts
原始类型
复杂类型
联合交叉类型
未知类型
不存在类型
接口类型
类型别名
枚举
泛型
类
工具类型
类型断言
2、Vue3
setup
ref
reactive
组件通信方式
computed计算属性
watch监听器
hook
toRefs
接口类型抽取
Teleport
Vue3响应式原理
六：移动端
安卓：
Java【推荐学习】
Kotlin
苹果：
Object-C
Swift【推荐学习】
跨端：
Uni
Flutter【性能高】【推荐学习】
七：桌面端
原生：
此处暂不议，后续会做补充。
跨端：
Tauri【基于Rust、性能高、体积小】【推荐学习】
Electron【基于Node.js、性能低、体积大】
Flutter【刚起步】
八、小程序
原生：
此处暂不议，后续会做补充。
跨端：
Uni
Taro【性能高】【推荐学习】
八：服务端 Node.js
备注： Node.js根据公司需要学习，如不需要可暂时不用学习，此处暂不议，后续会做补充。
九：其它
可视化：
2D: Svg
Canvas
D3.js
Echarts
3D： WebGL
Three.js
- END -
