三大原则：各司其责、组件封装、过程抽象
推荐阅读入门书籍：犀牛书、红宝书
各司其职
HTML/CSS/JS各司其职
避免不必要的JS直接操作样式
纯展示类交互寻求零JS方案
组件封装
组件设计的原则：封装性、正确性、扩展性、复用性
实现组件的步骤：结构设计、展现效果、行为设计
三次重构：插件化、模板化、抽象化
过程抽象
过程抽象：例如react hooks，纯函数
等价函数
节流、防抖（自动保存--当键盘不敲的时候再保存）
质量优化
实践1 交通灯
版本1
code.juejin.cn/pen/7108196…
版本2 数据抽象
code.juejin.cn/pen/7108196…
版本3 过程抽象
code.juejin.cn/pen/7108196…
版本4 异步+函数式
code.juejin.cn/pen/7108196…
实践2 洗牌
错误写法
code.juejin.cn/pen/7108202…
正确写法
code.juejin.cn/pen/7108203…
使用生成器
code.juejin.cn/pen/7108203…
实践3 分红包
切西瓜法
code.juejin.cn/pen/7108203…
抽牌法
code.juejin.cn/pen/7108204…
