【箭头函数：this关键字指向问题】

Es6里的箭头函数大家都不陌生，最常见的就是vue里边forEach循环经常使用箭头函数，很

少用for循环，原因就在于箭头函数里的this指向问题

请看下面的这道题：

输出是什么呢？

const shape = {
  radius: 10,
  diameter() {
    return this.radius * 2
  },
  perimeter: () => 2 * Math.PI * this.radius
}

console.log(shape.diameter())
console.log(shape.perimeter())

20 and NAN

解答：

注意 diameter 的值是一个常规函数，但是 perimeter 的值是一个箭头函数。 对于箭头函数，this 关键字指向的是它当前周围作用域（简单来说是包含箭头函数的常规函数，如果没有常规函数的话就是全局对象），这个行为和常规函数不同。这意味着当我们调用 perimeter 时，this 不是指向 shape 对象，而是它的周围作用域（在例子中是 window）。 在 window 中没有 radius 这个属性，因此返回 undefined。