普通函数用function关键字定义，有独立this和arguments；箭头函数用=>定义，不绑定this和arguments，继承外层作用域，不可提升、不可作为构造函数。
普通函数用 function 关键字定义，有独立 this 和 arguments
普通函数是 JavaScript 最基础的函数形式，必须用 function 关键字声明，可以具名或匿名。它会创建自己的 this 绑定（取决于调用方式），也自带 arguments 类数组对象。
- 具名函数：
function sayHello(name) { return `Hello, ${name}`; } - 匿名函数赋值：
const greet = function(name) { return `Hi, ${name}`; }; - 作为方法时，
this指向调用它的对象：const obj = { name: 'Alice', getName() { return this.name; } }; obj.getName(); // 'Alice' - 在事件回调或
setTimeout中容易丢失this：obj.handleClick = function() { console.log(this.name); }; button.addEventListener('click', obj.handleClick); // 点击时 this 是 button，不是 obj
箭头函数用 => 定义，不绑定 this 和 arguments
箭头函数是 ES6 引入的简写语法，没有自己的 this、arguments、super 或 new.target，全部继承自外层作用域。它不能用作构造函数，也不能使用 yield。
- 基本写法：
const add = (a, b) => a + b;
- 单参数可省括号：
const square = x => x * x;
- 函数体多行需用大括号和
return：const logAndReturn = (x) => { console.log(x); return x; }; - 在对象方法中要小心：
const obj = { name: 'Bob', getName: () => this.name }; obj.getName(); // undefined，因为箭头函数的 this 是全局或外层，不是 obj - 适合用在回调中避免
this丢失：const obj = { value: 42, run() { setTimeout(() => console.log(this.value), 100); } }; obj.run(); // 42，箭头函数捕获了外层 run 的 this
普通函数能被提升，箭头函数不能
函数声明（function foo() {}）会被提升到作用域顶部，可在定义前调用；而箭头函数本质是赋值表达式，只能在声明之后使用。
- 这个能运行：
console.log(foo()); // 'ok' function foo() { return 'ok'; } - 这个会报错：
console.log(bar()); // TypeError: bar is not a function const bar = () => 'ok';
- 同理，
var声明的函数表达式也会被提升但值为undefined，不如直接避免混用
该选哪个？看场景，不是看简洁度
别因为箭头函数写起来短就默认用它。关键看是否需要动态 this、是否要作为构造函数、是否在需要 arguments 的老式逻辑里。
立即学习“Java免费学习笔记（深入）”；
- 用普通函数：
Object.prototype方法、Vue/React 的选项式组件中的methods、需要new实例化的类、需要访问arguments的兼容写法 - 用箭头函数：
map/filter回调、setTimeout/Promise链内、React 函数组件内的事件处理（避免重复绑定）、封装工具函数（无状态） - 特别注意：
addEventListener传箭头函数会导致无法移除监听器 —— 因为每次都是新函数：btn.addEventListener('click', () => doSomething()); // ❌ 无法 removeEventListener btn.removeEventListener('click', () => doSomething()); // 不是同一个函数引用
普通函数和箭头函数的差异不在语法糖层面，而在执行上下文模型。漏掉 this 继承规则或提升行为，很容易在重构或调试时卡住。
