JavaScript(19)——环境对象，回调函数，事件流

环境对象

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

• 函数的调用方式不同，this指代的对象也不同
• 谁调用，this就是谁
• 直接调用函数，其实相当于是window函数，所以指代window

回调函数

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

事件流

事件流指的是事件完整执行过程中的流动路劲

说明：假设页面里有div，当事件触发时，会经历两个阶段，分别是捕获阶段和冒泡阶段

简单来说，捕获阶段就是从父到子，冒泡阶段就是从子到父

事件捕获

概念：从DOM的根元素开始去执行对应的事件（从外到里），需要写代码才能看到。

代码：

DOM.addEventListener(事件类型，事件处理函数，是否使用捕获机制)

true代表捕获阶段，false代表冒泡阶段（默认）

事件冒泡 

概念：当一个元素被触发时，同样的事件将会在该元素的所有祖先元素中一次触发。

mouseover和mouseout会有冒泡效果

mouseenter和mouseleave没有冒泡效果

阻止冒泡

默认就有冒泡模式的存在，所以容易导致事件影响到父级元素

语法：事件对象.stopPropagation()

此方法可以阻断事件流动传播，不光在冒泡阶段有效，捕获阶段也有效。 

解绑事件

on事件方式，直接使用null覆盖偶就可以实现事件的解绑

语法：

btn.onclick = function(){

  alert('点击了')

}

btn.onclick = null

 如果使用addEventListener，必须使用

removeEventListener(事件类型，事件处理函数，[获取捕获或者冒泡阶段])

例如：

function fn(){
  alert('点击了')
}
//绑定事件
btn.addEventListener('click',fn)
//解绑事件
btn.removeEventListener('click',fn)

 注意：匿名函数无法被解绑