JavaScript|青训营笔记

这是我参与【第五届青训营】伴学笔记创作活动的第一天

1.写好JS的一些原则： 各司其职：让HTML、CSS和JavaScript职能分离； 组件封装：好的UI组件具备正确性、扩展性、复用性； 过程抽象：（代码复用、扩展）应用函数式编程思想；

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

2.组件化 组件是指Web页面上抽出来一个个包含模板（HTML）、功能（JS）和样式（CSS）的演员；组件要具有封装性、正确性、扩展性、复用性。

2.1轮播图 结构：HTML 轮播图是一个典型的列表结构，可以使用无序列表ul元素来实现； 表现：CSS 使用CSS绝对定位将图片重叠在同一个位置 轮播图切换的状态使用修饰符 轮播图的切换动画使用CSS 行为：JS(API) 控制流：使用自定义事件来解耦

总结：组件封装基本方法 *结构设计 *展现效果 *行为设计 API（功能） Event（控制流）

2.2优化 重构：插件化 解耦：将控制元素取成插件 插件与组件之间通过依赖注入方式建立联系

2.3进一步优化 重构：模板化 解耦:将HTML模板化，更易于扩展 抽象：将组件通用模型抽象出来 组件框架：组件，包含插件

2.4总结 *实现组件的步骤：结构设计、展现效果、行为设计 *三次重构：插件化、模板化、抽象化（组件框架）

3.过程抽象 *用来处理局部细节控制的一些方法 *函数式编程思想的基础应用

高阶函数：once
function once(fn){
    return function(...args){
        if(fn){
        const ret = fn.apply(this, args);
        fn = null;
        return ret;
        }
    }
}

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

3.2高阶函数
  HOF
  *以函数作为参数
  *以函数作为返回值
  *常用于函数装饰器
  
  常用的高阶函数（HOF）：
  Once，Throttle、Debounce、Consumer/2、Iterative
  
 3.3命令式编程语言：面向对象、面向过程
 声明式编程语言
 JavaScript既可以是命令式的，也可以是声明式的
 声明式代码更简洁
 

4.写代码应该关注：风格、效率、约定、！使用场景、设计 5.总结：今天学习有关写好JavaScript的注意事项。其中了解到一个功能的实现可以由多种方式的实现机制，但是要根据实际应用场景写出适合的代码，确保代码高效、有效地运行，确保功能的完善。