这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天。 今天月影老师给我们介绍了如何实现代码的改造和优化，将本来没有分离的代码一步步封装，实现模块化，并且给我们展示了JavaScript、CSS、HTML各司其责的优点，能够使得代码更方便阅读，同时使得改动更加方便，今天的五节课使我收获颇多。 写好JavaScript的一些原则： 1.各司其责：让CSS、HTML、JavaScript职能分离，HTML负责网页结构，CSS负责网页表现，JavaScript负责网页行为。应当避免不必要的由JavaScript直接操作样式，可以用class来表现状态，纯展示类交互寻求零JavaScript方案。 2.组件封装：好的UI组件具备正确性、扩展性、封装性、复用性。组件是指web页面上抽出来一个包含模板（HTML）、功能（JavaScript）、样式（CSS）的单元。基本方法：结构设计、展现效果、行为设计（API用以实现功能，Event用以控制流，实际是用自定义事件来解耦）。 3.过程抽象：应用函数式编程思想，用高阶函数将覆盖不同事件的要求剥离出来，这是用来处理局部细节控制的一些方法。 重构：使插件化、模板化、抽象化，将组件框架抽象化，将组件通用模型抽象出来。 解耦：将控制元素抽取成插件，插件与组件之间通过依赖注入方式建立联系，将HTML模板化，更易扩展。 高阶函数：以函数作为参数，以函数作为返回值，常用于作为函数装饰器。 常用的高阶函数：Once,Throttle(节流，触发频率限制),Debounce（防抖，当操作停止时代码功能才实现）,Consumer/2（演示调用，每隔一定间隔调用）,Iterative（批量操作元素） 纯函数：行为可预期且没有副作用（如2+3一定为5），输入确定时输出确定，可直接测试，可维护性高。 非纯函数：每次调用结果不同，取决于被调用次数，会改变外部状态，测试时需先初始化，测试结束时销毁测试环境。
