这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天
如何写好JS
（上）
写好JS的一些原则：
- 各司其职
- 组件封装
- 过程抽象
一、“各司其职”
- HTML/CSS/JS 各司其职
- 应当避免不必要的由JS直接操作样式
- 可以用class来表示状态
- 纯展示类交互寻求零JS状态
例子：写一段JS，控制一个网页，让它支持浅色和深色两种浏览模式。
-
方法一：
-
方法二：
-
方法三：
二、组件封装
步骤：
- 结构设计
- 展现效果
- 行为设计
- API（功能）
- Event（控制流）
三次重构：
- 插件化
- 模板化
- 抽象化（组件框架）
例子：用原生JS实现一个电商网站的轮播图
HTML/CSS 略。
JS代码：
- 行为设计：API
- 行为设计：控制流
重构：插件化
解耦：
- 将控制元素抽取成插件
- 插件与组件之间通过依赖注入方式建立联系
重构：模板化
- 将HTML模板化，更易于扩展
重构：组件框架
- 将通用的组件模型抽象出来
过程抽象
- 用来处理局部细节控制的一些方法
- 函数式编程思想的基础应用
常用高阶函数：
- Once
- Throttle
- Debounce
- Consumer/2
- Iterative
编程范式
命令式与声明式
- 命令式
- 声明式
（下）
写代码应该关注：
- 代码更简洁
- 效率提升
- 性能更好
