这是我参与「第五届青训营 」伴学笔记创作活动的第 2 天

一、重点内容

1. JavaScript 编码原则之各司其责
2. JavaScript 编码原则之组件封装
3. JavaScript 编码原则之过程抽象
4. JavaScript代码优化

二、js编码原则与优化

1.JavaScript 编码原则之各司其责

让HTML,CSS和JavaScript职能分离。写代码的时候要避免js直接操作样式，可以通过使用class表示状态。有些纯展示的可以不需要js代码。

2.JavaScript 编码原则之组件封装

HTML构成结构，CSS构成表现，JS构成行为，组件是指Web页面上抽出来的包含模版（HTML）、功能（JS）和样式（CSS）的单元。好组件具备正确性、封装性、扩展性、复用性。

3.JavaScript 编码原则之过程抽象

过程抽象用于处理局部细节控制的一些方法，是函数式编程思想的基础应用。 高阶函数（high-order function 简称：HOF），咋一听起来那么高级，满足了以下两点就可以称作高阶函数了：

• 函数可以作为参数被传递
• 函数可以作为返回值输出 高阶函数（HOF）是过程抽象思想的体现之一。高阶函数以函数为参数，以函数为返回值，常用作函数装饰器。 js代码有命令式和声明式两种不同风格。编程范式也是过程抽象思想的成果，

4.JavaScript代码优化

编写代码时，风格、效率、约定、使用场景、设计都是值得关注的方面。月影老师介绍了left-pad后面的故事和代码的质量和性能优化，从while循环累加，到内置repectAPI,并讲解repeact底层快速幂去优化时间复杂度，从O(n)优化到O(logn)。讲解了一下快速幕实现的原理，接着还有一些业内优化时间复杂度的方案，后面串联此前讲解的好代码经验，结合具体案例讲解，有交通灯、洗牌和分红包三个代码实践，就写好 JavaScript代码进行总结与升华。即使是JS代码，算法的正确性和验证、算法的效率和优化依然是值得重视并研究的要点。