这是我参与伴读笔记创作活动的第7天

什么是JavaScript?

JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

各司其责

使HTML、CSS和JavaScript职能分离。

• HTML/CSS/JS各司其责
• 应当避免不必要的由JS直接操作样式
• 可以用class来表示状态
• 纯展示类交互寻求零JS方案

组件封装

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

组件设计原则：封装性，正确性，扩展性，复用性

实现组件的步骤/基本方法

• 结构设计
• 展现效果
• 行为设计==>包括API（功能）、Event（控制流）

重构

插件化：

• 将控制元素抽取成插件
• 插件和组件之间通过依赖注入方式建立联系

模板化：

• 将HTML模板化，更易于扩展

抽象化（组件框架）：

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

过程抽象

• 应用函数式编程思想。用来处理局部细节控制的一些方法。
• 函数式编程思想的基础应用。

高阶函数

Once：

为了能够让”只执行一次“的需求覆盖不同的事件处理，可将这个需求剥离出来。这个过程一般称为过程抽象。

HOF：

• 以函数作为参数
• 以函数作为返回值 常用于作为函数装饰器
• HOF HOFO =>默认函数
• Once => 单次函数
• Throttle => 节流函数
• Debounce => 防抖函数
• Consumer => 间隔、延时
• Iterative => 可迭代函数 （批量操作）

编程范式

命令式与声明式

命令式

命令式编程关注计算机执行的步骤，告诉编辑器如何做

let list = [1, 2, 3, 4]; let mapl = []; for(let i = 0; i < list.length; i++) { mapl.push(list[i] * 2); }

声明式

声明式编程以数据结构的形式来表达程序的执行逻辑。告诉编辑器做什么，但不指定具体要怎么做。

let list = [1, 2, 3, 4]; const double = x => x*2; list.map(double);