箭头函数喝普通函数的区别

箭头函数和普通函数在以下几个方面有所不同：

1. 语法简洁：箭头函数使用箭头 => 来定义函数，从而省略了关键字 function 和花括号。
2. 作用域：箭头函数没有自己的 this 对象，它们会捕获调用它们的上下文的 this 值。
3. 参数解构：箭头函数可以直接在参数列表中进行参数解构。
4. 返回值简写：箭头函数可以省略关键字 return 和花括号，直接返回表达式的值。
5. 调用方式：箭头函数可以作为表达式进行调用，也可以作为函数进行调用。

下面是一个代码示例，展示了箭头函数和普通函数在以上方面的区别：

// 定义一个普通函数
function sum(a, b) {
  return a + b;
}

// 定义一个箭头函数
const sumArrow = (a, b) => a + b;

// 调用普通函数
console.log(sum(10, 20));

// 调用箭头函数
console.log(sumArrow(10, 20));

// 作为表达式调用
const result = sumArrow(30, 40);

console.log(result);

在这个示例中，定义了一个普通函数 sum 和一个箭头函数 sumArrow，它们都用于计算两个数的和。通过调用这两个函数并打印结果，可以看到它们的行为是相同的。 然而，当将 sumArrow 作为表达式进行调用时，它会立即返回计算结果，而不需要使用 return 关键字。 希望这个示例能够帮助你更好地理解箭头函数和普通函数之间的区别。