разрушение функции объекта в JavaScript ES6

Question

const circle = {
  radius: 10,
  color: 'orange',
  getArea: function() {
    return Math.PI * this.radius * this.radius;
  },
  getCircumference: function() {
    return 2 * Math.PI * this.radius;
  }
};

let {radius, getArea, getCircumference} = circle;
console.log(getArea());

Я получаю значение радиуса и цвет, но когда я вызываю getArea (1) или getArea (5), я получаю NaN, как мне заставить функцию работать?

ожидается получить 314,15

Answer 1

Для нормальных функций значение this определяется тем, как вы вызываете функцию. Если вы звоните:

circle.getArea()

Тогда это говорит о необходимости вызова функции getArea с this, равным circle. Если вместо этого у вас есть отдельная функция и вызовите

getArea()

Тогда вы не сказали ему, что this должно равняться, поэтому по умолчанию это объект окна (в нестрогом режиме) или неопределенный (в строгом режиме). Вместо этого, либо назовите его первым способом, либо используйте call / apply , чтобы явно установить значение этого

getArea.call(circle)

Или создайте связанную копию функции.

const boundGetArea = circle.getArea.bind(circle);
boundGetArea();