js（三）

本周学习了事件、正则表达式和正则分组、ES6的知识、运动。
事件：
事件是由访问Web页面的用户引起的一系列操作。当用户执行某些操作的时候，再去执行一系列代码，或者用来获取事件的详细信息，如鼠标位置、键盘按键等。JS处理的事件类型为：鼠标事件、键盘事件、HTML事件。

鼠标事件:

onclick	用户单击鼠标按钮或按下回车键触发
ondblclick	当用户双击主鼠标按钮时触发
onmousedown	当用按下鼠标还未弹起时触发
onmouseup	当用户释放鼠标按钮时触发
onmouseover	当鼠标移到某个元素上方时触发
onmouseout	当鼠标移出某个元素上方时触发
onmousemove	当鼠标指针在元素上移动时触发

HTML事件：

onload	当页面或者资源完全加载后在window上面触发，或当框架集加载完毕后在框架集上触发
onselect	当用户选择文本框中的一个或多个字符触发
onchange	当文本框内容改变且失去焦点后触发
onfocus	当页面或者元素获得焦点时在window及相关元素上触发
onblur	当页面或元素失去焦点时在window及相关元素上触发
onresize	当窗口或框架的大小变化时在window或框架上触发
onsroll	当用户滚动带滚动条的元素时触发

当触发某个事件时，会产生一个事件对象，这个对象包含着所有与事件有关的信息。包括导致事件的元素、事件的类型、以及其它与特定事件相关的信息。
通过事件绑定的执行函数是可以得到一个隐藏参数的。说明，浏览器会自动分配一个参数，这个参数其实就是 event 对象。
Event对象获取方式 （兼容性）

function（e）｛
  var e = e || window.event
｝

event.button属性	当前事件触发时哪个鼠标按键被点击
clientX、clientY属性	鼠标在可视区X坐标和Y坐标，即距离左边框和上边框的距离
screenX、screenY属性	鼠标在屏幕区X坐标和Y坐标，即距离左屏幕和上屏幕的距离
offsetX、offsetY属性	鼠标相对于事件源的X坐标和Y坐标
pageX、pageY	鼠标相对于文档的X坐标和Y坐标

键盘事件keyup、keydown、keypress。
onkeydown：当用户按下键盘上任意键触发，如果按住不放，会重复触发；
onkeypress：当用户按下键盘上的字符键触发，如果按住不放，会重复触发；
onkeyup：当用户释放键盘上的键触发。

组合键ctrlkey、altkey、shiftkey
altKey属性，bool类型，表示发生事件的时候alt是否被按下；
ctrlKey属性，bool类型，表示发生事件的时候ctrl是否被按下；
shiftKey属性，bool类型，表示发生事件的时候shift是否被按下。
keyCode/which兼容：

evt.keyCode || evt.which

事件源（事件在哪个元素上产生）

var target = evt.target || evt.srcElement；

事件的冒泡：事件按照从特定的事件目标到最不特定的事件目标（document对象）的顺序触发。简单来说就是子元素一直向父元素顺序触发，知道document对象为止。阻止事件冒泡：

 e.stopPropagation（）；//低版本IE：e.cancelBubble = true。

事件默认行为：JS事件本身所具有的属性。
阻止方式：w3c的方法：

e.preventDefault（）；IE的是：e.returnValue = false；或者return false。

DOM2级事件处理程序：添加事件监听器：

element.addEventListener(“click”,function(){},false);//false 事件冒泡；
element.addEventListener(“click”,function(){},true);//true事件捕获；
移除事件监听器：removeEventListener(事件名，处理函数)；
IE8及以下的事件监听器：attachEvent(事件名，处理函数)，detachEvent(事件名，处理函数)。

事件委托：利用事件冒泡的原理，把本应添加给某元素上的事件委托给他的父级（外层）。

拖拽效果：利用三个事件去实现；onmousedown、onmousemove、onmouseup；

正则：
学习了正则的概念、创建方式、正则的对象方法、字符串函数、正则表达式的构成、常用的正则表达式和正则分组。正则主要运用到表单的验证，是表单验证十分有效的方法，需要记忆和练习。
ES6：
学习了this关键字以及bind、let/const、变量解构、箭头函数、模版字符串、class和继承。这些新增的属性需要去记忆和使用才可以掌握。
运动：
使用setInterval实现。可以实现物体的匀速运动、对边界的处理、加速和减速运动、抛物线运动、透明度的变换以及缓冲运动。