这是我参与「第五届青训营 」伴学笔记创作活动的第三天。
一、本堂课重点内容：
本节课从实践维度解读在实际编码过程中何种类型的 JavaScript 代码称之为“好代码”，并从 JS 出发，总结其他语言编码可遵循的共性原则，由浅入深。而后围绕编码三大原则组件封装原则展开，并详细解读编码三大原则的过程抽象原则。最后举出实例，详细介绍了如何写好JS。
二、详细知识点介绍：
1. JavaScript 好代码的标准
1） 各司其职
让HTML、CSS和JS职能分离。
- 避免不必要的JS直接操作样式
- 可以用class表示状态
- 纯展示类交互寻求零JS方案
2） 组件封装
组件是指Web页面上抽出来的一个个包含模板（HTML）、功能（JS）和样式（CSS）的单元。好的组件具备封装性、正确性、扩展性和复用性。自从 React，Vue 等前端框架在市面上大量使用之后，组件化开发逐渐成为了前端主流开发方式。
- 结构设计
- CSS展示效果
- 行为设计
- API（功能）
- Event（控制流）
- 重构（插件化）
- 解耦
- 将控制元素抽取成插件
- 插件与组件之间通过依赖注入方式建立联系
- 重构（模板化）
- 将HTML模板化，更易于扩展
- 重构（抽象化）
- 将组件通用模型抽象出来
3） 过程抽象
- 用来处理局部细节控制的一些方法
- 函数式编程思想的基本应用
- 高阶函数
- 为了能够让“只执行一次”的需求覆盖不同的事件处理，我们可以将这个需求剥离出来，这个过程为过程抽象
- 以函数为参数
- 以函数为返回值
- 常用于作为函数修饰器
应用函数式编程思想。
2. 编程范式
- 命令式
- 面向过程
- 面向对象
- 声明式
3. 代码优化
- 数据抽象
- 过程抽象
- 异步+函数化
三、实践练习例子：
四、课后个人总结：
学习了本节课我知道了，JS的基本用法，了解了其三大原则，在写代码时如何判断一个代码的好坏，受益匪浅。
五、引用参考：
本篇文章代码均引用老师在掘金课堂中的示例。
