js中箭头函数的简单使用

介绍

• 可以更快捷的书写函数
• 不绑定this（即在调用对象的一些方法时，this不会随着方法调用对象的变化而变化）

使用

• 快捷书写函数

{
  // 直接返回值，如果是使用{}包裹着的话，不会返回值
  let a = (num) => num * 2;
  console.log(a(2)); // 4
  let b = (num) => {
    num * 2;
  };
  console.log(b(2)); // undefined
}

• 不绑定this

{
  let car = {
    name: "bmw",
    price: 1223,
    // 数量
    num: 2,
    // 总价
    totalPrice: function () {
      // 普通函数
      window.setTimeout(function () {
        console.log(this.price * this.num); // NaN
      }, 1000);

      // 箭头函数
      window.setTimeout(() => {
        console.log(this.num * this.price); // 2446
      }, 2000);
    },
  };
  car.totalPrice();
}

使用场景

• 类似Object.method()的调用推荐使用普通函数声明，其他的调用都可以使用箭头函数