这是我参与「第五届青训营 」伴学笔记创作活动的第 10 天
此课程不拘泥于javascript的语法基础与细节，而是默认在具有javascript基础的前提下，教授一些关于怎么写好Js的原则。
javascript编码原则：
- 各司其责
- 组件封装
- 过程抽象
各司其责
课程中强调的是网页编写时让html, css, javascript的职能分离。分离并非是简单的将不同类型的代码放置在不同类型的文件中，即按文件拆分，而是指按功能进行拆分。
通常来说，html控制网页的结构，css控制网页的样式，外观。而javascript用于控制网页的互动逻辑。
因此，在编写与样式控制相关的javascript代码时，应该避免通过element.style直接修改元素的样式，而应该提前定义样式相关的css类，在javascript中修改类名，从而完成样式的改变逻辑。
虽然将css、javascript文件区分在webpack等打包中是常用操作。但在最近的vue框架中，SFC也体现了各司其责原则的思想。
组件封装
在 JavaScript 中，组件封装是一种流行的编程原则，它使代码更具可重用性、可维护性和可扩展性。以下是一些组件封装的最佳实践：
- 单一职责原则：每个组件应该只关注一个功能。这样可以使组件更容易理解、测试和维护。
- 封装性原则：组件应该尽可能地封装自己的实现细节，同时提供必要的接口供其他组件使用。这可以防止组件被其他代码直接修改，从而增加代码的稳定性和可靠性。
- 可定制化原则：组件应该尽可能灵活，能够适应不同的需求。这可以通过提供配置选项和回调函数等方式实现。
- 可复用性原则：组件应该可以在多个项目中重复使用，而不需要重复编写相同的代码。这可以通过将组件发布到 NPM 或者使用自己的私有库等方式实现。
- 高内聚低耦合原则：组件应该具有高内聚性，即组件内部的各个部分应该紧密地联系在一起，同时又应该具有低耦合性，即组件之间的依赖应该尽可能少，以便组件更容易维护和扩展。
在实践中，可以使用类或函数来实现组件封装。无论使用哪种方式，都应该尽可能遵循上述的原则，以便开发出更具可靠性、可维护性和可扩展性的代码。
过程抽象
通过函数式原则编写javascript代码。函数式的缺点在于重复构建的对象，引起性能问题，但在当前内存已经可以随便用的场景下，采用函数式编程能降低错误倾向，便于测试。
在 JavaScript 中，过程抽象是一种常用的编程原则，它允许开发者将重复的代码逻辑封装成一个函数，以提高代码的可读性、可维护性和可重用性。以下是一些过程抽象的最佳实践：
- 通用性原则：函数应该尽可能通用，以便能够在不同的场景下重复使用。这可以通过将函数的输入参数尽可能地抽象化来实现，从而使函数能够适应不同的数据类型和数据结构。
- 明确函数目的：函数应该有一个明确的目的，只完成一件事情，并尽可能地简单和清晰。这样可以让函数更加易于理解、测试和维护。
- 抽象控制流程：将函数的控制流程从具体的实现中抽象出来，可以使代码更加简洁、灵活和易于扩展。常见的抽象控制流程的方式包括使用回调函数、Promise 和 async/await 等。
- 纯函数原则：尽可能将函数设计为纯函数，即函数的输出只取决于输入，不会产生副作用。这样可以使函数更加可预测、可测试和可组合。
- 模块化原则：将函数封装在模块中，可以使代码更加易于组织和管理。同时，使用 ES6 的模块化系统可以使代码更加易于重用和扩展。
