JS记忆加深点（二）

上一篇用了MD编辑器发现并不是那么的习惯 还是用原本的吧

本篇主要是JS高级的this指向、Event对象、事件流等相关内容 所写内容仅为个人见解

一、this在事件中指向问题

        在默认情况下this关键字指向的是全局上下文 但是在事件中他所指向的则是触发事件的函数 不过也有例外在你所触发的事件中如果出现箭头函数则会将this所指对象指向定义函数的全局上下文 因为箭头函数没有自己的全局山下文 他的上下文继承于定义它的全局上下文

二、Event对象兼容处理

        什么事Event对象 这个点我最开始也是很模糊的只知道有这个东西他有点像接收变量的一个对象 但实际上Event没有这么简单 

        当事件发生时，浏览器会创建一个Event对象，并将其传递给事件处理程序函数。Event对象包含有关事件的信息，例如事件类型，目标元素和事件发生的时间戳。可以通过event参数来传递Event对象 并使用它的对象属性和方法

         - event.target：返回触发事件的元素。
         - event.type：返回事件类型的名称，例如"click"或"keydown"。
         - event.preventDefault()：取消事件的默认行为，例如阻止表单提交或链接跳转。
         - event.stopPropagation()：停止事件的传播，防止它被其他元素捕获。

        那么回到兼容性的问题上

        一种处理Event对象兼容性的方法是使用event参数来传递事件对象，并使用event对象的属性和方法来访问事件信息，event参数将传递给事件处理程序函数，并且您可以使用event.target属性来访问事件目标。这种方法在所有浏览器中都应该有效

        另一种处理Event对象兼容性的方法是使用window.event来访问事件对象，使用window.event或arguments[0]来访问事件对象。这种方法在旧版Internet Explorer浏览器中可能更有效。

三、事件流

        事件流这个如果不清楚你联想到冒泡排序就知道了 事件流简单的来说就是从触发事件开始从最外层像最内层逐一传递直至目标然后再返回向上冒泡 直到文档对象 这个过程就是事件流

        

 四、bind、call、apply使用

call、apply、bind这三个方法都是用来改变this的指向的
bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用 。

js中call、apply、bind的用法及区别_51CTO博客_call apply bindhttps://blog.51cto.com/u_15983333/6091985#:~:text=apply%20%E3%80%81%20call%20%E3%80%81bind%20%E4%B8%89%E8%80%85%E9%83%BD%E6%98%AF%E7%94%A8%E6%9D%A5%E6%94%B9%E5%8F%98%E5%87%BD%E6%95%B0%E7%9A%84this%E5%AF%B9%E8%B1%A1%E7%9A%84%E6%8C%87%E5%90%91%E7%9A%84%EF%BC%9B%20apply%20%E3%80%81%20call,call%20%E3%80%81bind%20%E4%B8%89%E8%80%85%E9%83%BD%E5%8F%AF%E4%BB%A5%E5%88%A9%E7%94%A8%E5%90%8E%E7%BB%AD%E5%8F%82%E6%95%B0%E4%BC%A0%E5%8F%82%EF%BC%9B%20bind%20%E6%98%AF%E8%BF%94%E5%9B%9E%E5%AF%B9%E5%BA%94%E5%87%BD%E6%95%B0%EF%BC%8C%E4%BE%BF%E4%BA%8E%E7%A8%8D%E5%90%8E%E8%B0%83%E7%94%A8%EF%BC%9Bapply%20%E3%80%81call%20%E5%88%99%E6%98%AF%E7%AB%8B%E5%8D%B3%E8%B0%83%E7%94%A8%20%E3%80%82