近年来，前端开发是一个很受欢迎的职业，但是知识之繁杂，技术迭代速度之快是其他技术所不能比拟的。
但是，与此相对的是，我发现极少或者几乎没有大学的计算机专业愿意开设前端课程，更没有系统性的教学方案出现。大部分前端工程师的知识，其实都是来自于实践和工作中零散的学习。
可以说很多前端开发者都是自学甚至转行过来的，前端入门简单，学习了几个API以后上手做项目也很简单，但是这往往成为了限制自身发展的瓶颈。
只是停留在会用阶段是远远不够的，我们还需要不断探索和深入。现在市面上并不缺少学习教程，技术文章，如果盲目的学习你会发现看过以后的知识留存率会很低，而且发现没有了解到的知识越来越多，这会让人产生焦虑。
实际上，除了坚持学习的强大的自驱力，你还需要一个很简单的学习方法。那就是：建立自己的知识体系。它能帮助你更系统性的学习，同时你也时刻能知道自己哪些地方是不足的。
JavaScript基础
变量和类型
JavaScript规定了几种语言类型JavaScript对象的底层数据结构是什么Symbol类型在实际开发中的应用、可手动实现一个简单的SymbolJavaScript中的变量在内存中的具体存储形式基本类型对应的内置对象，以及他们之间的装箱拆箱操作6.理解值类型和引用类型null和undefined的区别至少可以说出三种判断JavaScript数据类型的方式，以及他们的优缺点，如何准确的判断数组类型可能发生隐式类型转换的场景以及转换原则，应如何避免或巧妙应用出现小数精度丢失的原因，javaScript可以存储的最大数字、最大安全数字，JavaScript处理大数字的方法、避免精度丢失的方法原型和原型链
理解原型设计模式以及JavaScript中的原型规则instanceof的底层实现原理，手动实现一个instanceof实现继承的几种方式以及他们的优缺点可以描述new一个对象的详细过程，手动实现一个new操作符理解es6class构造以及继承的底层实现原理HTML和CSS
从规范的角度理解HTM，从分类和语义的角度使用标签常用页面标签的默认样式、自带属性、不同浏览器的差异、处理浏览器兼容问题的方式元信息类标签(head、title、meta)的使用目的和配置方法HTML5离线缓存原理可以使用CanvasAPI、SVG等绘制高性能的动画
CSS
掌握一套完整的响应式布局方案框架和类库
轮子层出不穷，从原理上理解才是正道
TypeScript、React、Vue、多端开发
开发和调试
熟练使用各浏览器提供的调试工具熟练使用一种代理工具实现请求代理、抓包，如charls可以使用Android、IOS模拟器进行调试，并掌握一种真机调试方案项目构建
可以使用npm运行自定义脚本理解Babel、ESLint、webpack等工具在项目中承担的作用ESLint规则检测原理，常用的ESLint配置Babel的核心原理，可以自己编写一个Babel插件可以配置一种前端代码兼容方案，如PolyfillWebpack的编译原理、构建流程、热更新原理，chunk、bundle和module的区别和应用小结
文中如有错误，欢迎在评论区指正，如果这篇文章帮助到了你，欢迎点赞和