你想知道在 JavaScript 函数里，形参写 $event 到底是什么意思

1. 先搞懂核心概念：事件对象（Event Object）

• 触发事件的元素（target）
• 事件类型（click/input 等）
• 鼠标位置（鼠标事件）、按键值（键盘事件）等

2. 代码示例：$event 的实际使用场景

场景 1：原生 JS 绑定事件（最基础）

// 给按钮绑定点击事件
const btn = document.querySelector('#btn');
btn.addEventListener('click', function($event) {
  // $event 就是浏览器传入的“点击事件对象”
  console.log($event.type); // 输出：click（事件类型）
  console.log($event.target); // 输出：<button id="btn">按钮</button>（触发事件的元素）
  $event.preventDefault(); // 阻止默认行为（比如a标签跳转）
});

场景 2：Vue 等框架中（$event 更常用）

<!-- Vue 示例 -->
<template>
  <button @click="handleClick($event)">点击我</button>
  <input @input="handleInput($event)" placeholder="输入内容">
</template>

<script>
export default {
  methods: {
    handleClick($event) {
      // $event 接收点击事件对象
      console.log('点击的元素：', $event.target);
    },
    handleInput($event) {
      // $event 接收输入事件对象，获取输入框的值
      console.log('输入的内容：', $event.target.value);
    }
  }
}
</script>

3. 关键注意点

• $ 符号不是必须的：你也可以把形参写成 e、event、evt，效果完全一样，比如：
  javascript

  btn.addEventListener('click', function(e) {
    console.log(e.target); // 和 $event.target 结果相同
  });
  
  用 $event 只是行业约定，目的是让代码更易读（一眼就知道这个参数是事件对象）
• 只有事件回调函数才有这个参数：普通函数里写 $event 没有任何特殊含义，就是一个普通形参名，比如：
  javascript

  // 普通函数，$event 就是普通参数
  function test($event) {
    console.log($event); // 传入什么就输出什么
  }
  test('hello'); // 输出：hello
  
• 事件对象的核心属性 / 方法（新手常用）：

  属性 / 方法	作用
  $event.target	触发事件的 DOM 元素
  $event.type	事件类型（如 click、input）
  $event.preventDefault()	阻止默认行为（如表单提交、a 标签跳转）
  $event.stopPropagation()	阻止事件冒泡

总结

1. $event 是开发者约定的形参名，用来接收浏览器 / 框架传入的 “事件对象”，不是 JS 关键字；
2. 核心作用是通过这个参数获取事件的详细信息（触发元素、事件类型等），或执行事件相关操作（阻止默认行为）；
3. 可以替换成 e/event 等任意名称，$ 仅为标识，不影响功能。