Javascript 有人能给我解释一下这个代码吗?

Javascript 有人能给我解释一下这个代码吗?,javascript,function,events,Javascript,Function,Events,我读过很多关于这个“e”和箭头函数的帖子,但我不明白 myDiv.addEventListener('mousedown',e=>{ x=e.clientX; y=e.clientY; 控制台日志(x); });该代码调用myDiv对象上的方法,我假设该对象是HTML元素。它传入两个参数: 'mousedown',一个字符串,告诉addEventListener将事件处理程序附加到哪个事件,以及 e=>{/*…*/},要附加的事件处理程序函数 稍后,如果该元素发生mousedown事件

我读过很多关于这个“e”和箭头函数的帖子,但我不明白

myDiv.addEventListener('mousedown',e=>{
x=e.clientX;
y=e.clientY;
控制台日志(x);
});该代码调用
myDiv
对象上的方法,我假设该对象是HTML元素。它传入两个参数:

  • 'mousedown'
    ,一个字符串,告诉
    addEventListener
    将事件处理程序附加到哪个事件,以及

  • e=>{/*…*/}
    ,要附加的事件处理程序函数

稍后,如果该元素发生
mousedown
事件,浏览器将调用事件处理程序函数,并将对象作为处理程序的唯一参数。处理程序在其
e
参数中接收该参数,并使用
事件
对象(
clientX
clientY
)上的属性,将它们分配给变量
x
y
,然后通过将
x
输出到浏览器控制台


我应该注意,除非
x
y
在您未显示的代码中声明,否则该事件处理程序将通过分配给未声明的标识符而成为我调用的对象。如果
x
y
仅用于事件处理程序函数中,则应使用
const
let
声明它们:

myDiv.addEventListener('mousedown', e => {
  const x = e.clientX;
  const y = e.clientY;
  console.log(x);
});
(也没有理由分配给
y
,除非它被用于某些用途。)

  • 事件处理程序中的回调函数
  • /*object*/.addEventListener(/*type*/,(e)=>{/*code*/});
    
    e
    参数指的是发生的导致侦听器触发的事件。 回调采用自动可访问的参数。
    2) 什么是clientX和clientY?这些是用户触发事件时客户端的位置。

    e代表事件您正在将e作为mousedown事件的参数传递给回调函数,并在函数中读取其属性对我来说似乎足够集中,但不足以与人争论。我们缺少一个“请在MDN上查找”的信息关闭另一个
    e=>{…}
    对应于
    函数(e){…}
    Ok。酷!我明白了。泰克人很多。我知道如何声明变量,并且知道Y是无缘无故存在的。我不该这么说。再次感谢您花时间回答。@Posoroko-不客气,编码快乐@mplungjan-主要是:-)当然,如果处理程序像他们经常做的那样使用
    this
    ,就会有很大的不同。(Posoroko-如果使用arrow函数,
    在函数内部和外部是相同的。使用事件处理程序,您有时希望
    由调用函数的代码控制。调用
    addEventListener
    回调的浏览器代码将
    设置为挂接该函数的元素例如,t on.@mplungjan-Yes,或
    e.currentTarget
    对于同一事物
    指浏览器控制
    的时间。