通往全栈之路

整理分享一些我在全栈之路上前进的一些知识和心得体会。 首先，这条道路是异常艰辛，抛开前端现在发展火热的趋势，依旧有部分公司对于前端的认知不够。

前端体系

Ⅰ	Ⅱ	Ⅲ	Ⅳ	Ⅴ	Ⅵ	Ⅶ	Ⅷ	Ⅸ	Ⅹ	Ⅺ
JavaScript	CSS	HTML	Vue	React	Angular	Webpack	NodeJs	Typescript	Test	FP

后端体系

Ⅰ	Ⅱ	Ⅲ	Ⅳ	Ⅴ	Ⅵ	Ⅶ	Ⅷ	Ⅸ	Ⅹ
算法✏️	操作系统💻	网络☁️	面向对象👫	数据库💾	Java ☕	系统设计💡	工具🔨	编码实践🙊	后记📝

前端知识体系详细梳理

• JavaScript基础与精粹深入探索
• CSS3基础与高级——神奇的世界探索
• 前端最最基础之——你不知道的html
• 世界第一好用前端框架VUE——全面解析
• 世界第一好玩前端框架React——全面解析
• 国内最少用前端框架Angular——全面解析
• 近年最火前端构建工具Webpack——全面解析
• NodeJs开发实践与Web框架
• Typescript时代已降临入门指南
• JavaScript与QA测试工程师
• JavaScript函数式编程超指南

前端知识精粹概览

Ⅰ 🌟 JavaScript基础与精粹深入探索

基础系列文章思路

1. 对于变量的探讨
2. 对于模块化发展历程的探讨
3. 对于原型链和作用域链的探讨
4. 对于关键API的探讨
5. 对于JavaScript继承的探讨

基础系列文章目录

• JavaScript基础之变量类型
• JavaScript内存管理与垃圾回收
• JavaScript四种常见内存泄漏 - 3
• JavaScript探究this奥秘之旅
• JavaScript基础当我谈论变量时 - 6
• JavaScript的模块化发展与现状 - 7
• JavaScript面向对象编程范式简介 - 8
• JavaScript原型链深度剖析和应用
• JavaScript深入之从作用域链理解闭包 - 10
• JavaScript深入之闭包面试题解 - 11
• 深入浅出图解作用域链和闭包 - 12
• 深度解析 new 原理及模拟实现 - 13
• JavaScript继承方式详解 - 14
• JavaScript立即执行函数

---

JavaScript运行机制深入

运行机制系列文章的思路

1. 了解JavaScript的内存管理，这是运行机制解析的铺垫工作
2. 在了解JavaScript的内存管理中，认识（Stack）和（Heap）
3. 分析Stack、Heap与Call Stack之间的关系和联系
4. 正式进入JavaScript执行机制的分析，主要是调用栈、异步队列和事件循环等概念解析。
5. JavaScript执行上下文分析基础文：分析VO、AO、GO和词法环境、变量环境的区别
6. JavaScriptES3中VO、AO、GO详解执行过程
7. JavaScript与ES5中词法环境详解过程
8. 实战，执行上下文的实例应用举例：闭包

系列文章目录

• JavaScript执行机制深度解析——调用栈和执行上下文

• JavaScript执行机制深度解析——执行上下文ES3规范和ES5规范

• JavaScript执行机制深度解析——ES3规范和Scope、VO、AO

• JavaScript执行机制深度解析——ES5规范和词法环境

• [JavaScript执行机制深度解析——变量对象解释闭包][125]

• [JavaScript执行机制深度解析——理解函数执行过程][126]

• JavaScript执行机制深度解析——调用栈、异步队列和事件循环

• JavaScript执行机制深度解析——浏览器和NodeJs中Event Loop区别

• JavaScript执行机制深度解析——NodeJs中Event Loop实例分析

补充目录

• JavaScript执行机制深度解析——内存管理
• JavaScript执行机制深度解析——什么是栈帧？
• JavaScript执行机制深度解析——垃圾回收与四种常见内存泄露
• JavaScript执行机制深度解析——Stack三个概念和Heap的解析

---

ES6新特性学习与实践

• ES6编程风格与精粹
• ES6之Promise原理与实践
• ES5实践ES6-promise A+规范
• ES6的Async/Await原理
• ES6深入之重新认识箭头函数的this

---

JavaScript编程小技巧

• 如何善用函数式编程
• 防抖/节流原理
• JavaScript的AOP编程
• JavaScript中立即执行函数详解
• JavaScript中call 和 apply原理与实践
• JavaScript中bind原理与实践
• JavaScript解析赋值、浅拷贝和深拷贝的区别
• JavaScript中的Mixin技巧

Ⅴ 🚀 世界第一好玩前端框架React——全面解析 🔗入口

框架解析思路如下：

• 认识React ，已经React全家桶成员，还有很多衍生框架
• React生命周期的变更，以及变更的原因
• React组件的介绍，各种组件的应用
• React类组件需要特殊注意事项
• React类组件和生命周期
• React函数组件和Hooks
• React事件机制
• React相关原理解析

1-React全家桶好用的插件

• prop-types: 类型检查插件
• classnames: 样式处理插件
• react-css-module: 样式处理插件
• react-powerplug: 基于 render props 的插件库，想更加深刻理解 render props 可以看下源码

2- React 组件类型一网打尽系列

1. 认识React组件基础篇——类组件&函数组件
2. 认识React组件基础篇——受控组件&非受控组件
3. 认识React组件基础篇——无状态组件和有状态组件
4. React组件设计技巧——展示型组件和容器型组件
5. React组件设计技巧——木偶组件和聪明组件
6. React组件设计技巧——高阶组件和函数子组件
7. React组件性能优化——PureComponent
8. React组件新能优化——Memo组件
9. React组件新能优化——lazy和suspense

3- React 基础知识详解系列

1. React生命周期大总结(含新旧版本对比)

4- React 生态之路由

1. react-router 原理
2. react-router 使用注意事项

5- React 生态之状态管理

Ⅶ Webpack

欢迎来到webpack的世界

Ⅻ 前端性能

后端知识体系

Ⅲ 网络

计算机网络需要掌握的知识

• 网络基础知识——认识TCP/IP