箭头函数和普通函数的区别，一代码说明

箭头函数和普通函数的主要区别在于它们的语法和作用域绑定。

箭头函数的语法比普通函数简洁，没有 function 关键字，使用箭头符号 => 来代替。另外，如果箭头函数只有一个参数，可以省略参数的括号；如果箭头函数的代码块只有一条返回语句，可以省略大括号和 return 关键字。

普通函数的作用域绑定是动态的，即在函数调用时确定其 this 值。而箭头函数的作用域绑定是静态的，即绑定在定义时，this 值由外层作用域决定，无法通过 call()、apply()、bind() 方法来改变 this 值。

示例代码如下：

// 普通函数
function add(x, y) {
  return x + y;
}

// 箭头函数
const multiply = (x, y) => x * y;

// 普通函数中的 this 值
const obj1 = {
  name: "Alice",
  getName() {
    console.log(this.name);
  }
};
obj1.getName(); // 输出：Alice

const obj2 = {
  name: "Bob"
};
obj1.getName.call(obj2); // 输出：Bob

// 箭头函数中的 this 值
const obj3 = {
  name: "Charlie",
  getName: () => {
    console.log(this.name);
  }
};
obj3.getName(); // 输出：undefined