如何写好JavaScript | 青训营

68 阅读2分钟

如何写好JavaScript

写好JS的一些原则

1)各司其职:让HTML、CSS和JavaScript职能分离

2)尽量不要在JavaScript中做CSS需要做的事情

· HTML/CSS/JavaScript各司其职

· 应当避免不必要的由JS直接操作样式

· 可以用class来表示状态

· 纯展示类交互寻求零JS方案

3)组件封装:好的UI组件具备正确性、扩展性、复用性

  组件是指Web页面上抽出来一个个包含模板(HTML)、功能(JS)和样式(CSS)的单元。好的组件具备封装性、正确性、扩展性、复用性。

总结

基本方法

· 结构设计

· 展现效果

· 行为设计:  API(功能)  Event(控制流)

 

重构:插件化

  解耦

· 将控制元素抽取成插件

· 插件与组件之间通过依赖注入方式建立联系

重构:模板化

 解耦

· 将HTML模板化,更易于扩展

组件框架

    抽象

· 将组件通用模型抽象出来

总结

· 组件设计的原则:封装性、正确性、扩展性、复用性

· 实现组件的步骤:结构设计、展现效果、行为设计

· 三次重构

   · 插件化

   · 模板化

   · 抽象化

4) 过程抽象:应用函数式编程思想

过程抽象

· 用来处理局部细节控制的一些方法

· 函数式编程思想的基础应用

 

高阶函数

HOF

· 以函数作为参数

· 以函数作为返回值

· 常用于作为函数装饰器

 

编程范式

   命令式与声明式

   例子:Toggle-命令式

             Toggle-声明式

             Toggle-三态  

总结

在今天的学习中,对JS的使用规范了解了很多。如何封装好一个组件是一个很值得深入学习的地方,以及后面的过程抽象。这两者我认为是非常重要的,需要花时间去消化。在代码优化的视频中,了解了许多算法的普通版本以及优化版,还有错误的版本。在JavaScript中只有遵循课程中的那些原则,才能让写出的JavaScript看起来更加规范,并且也可以提高他人观看的效率。对团队中的相互协作也有着至关重要的地方。JavaScript还有很多东西值得去学习。