В чем разница между стрелочной и обычной функциями

1️⃣ Как кратко ответить

Стрелочные функции не имеют собственного контекста this, они наследуют его из окружающей области. Обычные функции имеют собственный контекст this, который определяется в момент вызова. Стрелочные функции не могут быть использованы как конструкторы и не имеют доступа к объекту arguments.

2️⃣ Подробное объяснение темы

В JavaScript существуют два основных типа функций: стрелочные функции и обычные функции. Они различаются по нескольким ключевым аспектам, которые важно понимать, особенно в контексте автоматизированного тестирования и написания тестов.

Контекст this

• Обычные функции: Контекст this определяется в момент вызова функции. Это значит, что this может указывать на разные объекты в зависимости от того, как функция была вызвана. Например, если функция вызывается как метод объекта, this будет указывать на этот объект.

const obj = {
  value: 42,
  getValue: function() {
    return this.value;
  }
};
​
console.log(obj.getValue()); // 42

• Стрелочные функции: Они не имеют собственного контекста this. Вместо этого они наследуют this из окружающей области, в которой были определены. Это делает их особенно полезными в ситуациях, где необходимо сохранить контекст this, например, при использовании методов массивов или в обработчиках событий.

const obj = {
  value: 42,
  getValue: () => {
    return this.value;
  }
};
​
console.log(obj.getValue()); // undefined, потому что `this` не указывает на `obj`

Использование в качестве конструкторов

• Обычные функции: Могут быть использованы как конструкторы для создания новых объектов. Это достигается с помощью ключевого слова new.

function Person(name) {
  this.name = name;
}
​
const person = new Person('Alice');
console.log(person.name); // Alice

• Стрелочные функции: Не могут быть использованы как конструкторы. Попытка использовать new с ними приведет к ошибке.

const Person = (name) => {
  this.name = name;
};
​
// const person = new Person('Alice'); // TypeError: Person is not a constructor

Объект arguments

• Обычные функции: Имеют доступ к объекту arguments, который содержит все аргументы, переданные функции.

function sum() {
  let total = 0;
  for (let i = 0; i < arguments.length; i++) {
    total += arguments[i];
  }
  return total;
}
​
console.log(sum(1, 2, 3)); // 6

• Стрелочные функции: Не имеют собственного объекта arguments. Если нужен доступ к аргументам, можно использовать оператор расширения ... (rest parameters).

const sum = (...args) => {
  return args.reduce((total, num) => total + num, 0);
};
​
console.log(sum(1, 2, 3)); // 6

Применение в AQA

В автоматизированном тестировании понимание различий между стрелочными и обычными функциями важно для написания корректных тестов и скриптов. Например, при работе с асинхронными операциями или обработчиками событий, стрелочные функции могут помочь избежать проблем с контекстом this. Однако, если требуется создать объект или использовать arguments, обычные функции будут предпочтительнее.