1. 前言

1. js中我们每天都要见到,用到 事件,方法,函数,但是很多人还是不清楚什么区别
2. 尤其是在是看一些UI框架官方文档的时候,组件的方法和事件都是分开的,其实从这里,也可以体会下区别
3. 今天简单的说下

---

2. 简介

1. 在 JavaScript 中事件、方法和函数是三个不同的概念，虽然它们之间可能会有交叉，但它们具有不同的含义和用法

---

3. 事件（Event）

1. 事件是浏览器或用户在页面上发生的交互动作，比如点击、鼠标移动、键盘输入等
2. 事件通常由浏览器触发，也可以由用户的交互引起
3. 在 JavaScript 中，可以使用事件监听器（event listener）捕捉和响应特定的事件

document.getElementById('myButton').addEventListener('click', function() {
  console.log('Button clicked!');
});

• MDN 解释

Event 接口表示在 DOM 中出现的事件
事件（Event）是由 DOM 元素产生的资源，它可以由 JavaScript 代码操作

---

4. 方法（Method）

1. 方法是与对象关联的函数，它通常在对象上调用
2. 方法可以用于执行特定的操作或任务，可能修改对象的状态或返回特定的值
3. 在 JavaScript 中，对象的属性可以包含函数，这些函数被称为该对象的方法

var person= {
  say: function() {
    console.log('吃了吗');
  }
};

person.say();

---

5. 函数（Function)

1. 函数是 JavaScript 中的基本构建块，它是一段可重复使用的代码块
2. 函数可以独立存在，也可以作为对象的属性（方法）存在
3. 函数可以被调用，可以接收参数，可以返回值
4. 函数不依赖于特定的对象，它可以是全局函数，也可以是作为其他函数的参数传递

function play() {
  console.log('玩呗!');
}

play();

• MDN解释

函数是 JavaScript 中的基本组件之一。
JavaScript 中的函数类似于过程——一组执行任务或计算值的语句。
但要成为函数，这个过程应该接受输入并返回与输入存在某些明显关系的输出。
要使用一个函数，你必须将其定义在你希望调用它的作用域内

---

6. 总结

1. 事件是与用户交互和页面状态变化相关的动作
2. 方法是对象上的行为

3. 而函数是可重复使用的代码块，它可能独立存在，也可能作为方法存在
4. 在 JavaScript 中，函数可以用于处理事件、成为方法，或者独立执行

---

参考资料

---

初心

我所有的文章都只是基于入门，初步的了解；是自己的知识体系梳理,如有错误,道友们一起沟通交流;

如果能帮助到有缘人,非常的荣幸,一切为了部落的崛起;

共勉