一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第3天，点击查看活动详情。

一、 事件

事件是在编程时系统内发生的动作或者发生的事情

比如用户在网页上单击一个按钮

• 事件监听:

让程序检测是否有事件产生，一旦有事件触发，就立即调用一个函数做出响应，也称为注册事件

• 语法： 元素。addEventListener('事件'，function(){})

事件监听三要素：

• 事件源： 那个dom元素被事件触发了，要获取dom元素

• 事件： 用什么方式触发，比如鼠标单击 click、鼠标经过 mouseover 等

• 事件调用的函数： 要做什么事

事件的版本：

• DOM L0

事件源.on事件 = function() { }

• DOM L2

事件源.addEventListener(事件， 事件处理函数)

发展史：

• DOM L0 ：是 DOM 的发展的第一个版本； L：level

• DOM L1：DOM级别1 于1998年10月1日成为W3C推荐标准

• DOM L2：使用addEventListener注册事件

• DOM L3： DOM3级事件模块在DOM2级事件的基础上重新定义了这些事件，也添加了一些新事件类型

补充：元素.value.length可获得（输入文字）长度

二、高阶函数

• 高阶函数可以被简单理解为函数的高级应用，JavaScript 中函数可以被当成【值】来对待，基于这个特性实现函数的高级应用。

• 【值】就是 JavaScript 中的数据，如数值、字符串、布尔、对象等。

1.1 函数表达式

函数表达式和普通函数并无本质上的区别：

• 普通函数的声明与调用无顺序限制，推荐做法先声明再调用

• 函数表达式必须要先声明再调用

1.2 回调函数

如果将函数 A 做为参数传递给函数 B 时，我们称函数 A 为回调函数

简单理解： 当一个函数当做参数来传递给另外一个函数的时候，这个函数就是回调函数

• 常见的使用场景：

1.3 环境对象

环境对象指的是函数内部特殊的变量 this ，它代表着当前函数运行时所处的环境

作用：弄清楚this的指向，可以让我们代码更简洁

• 函数的调用方式不同，this 指代的对象也不同

• 【谁调用， this 就是谁】 是判断 this 指向的粗略规则

• 直接调用函数，其实相当于是 window.函数，所以 this 指代 window