Что это

Это функция стрелки. Функции Arrow - это короткий синтаксис, введенный ECMAscript 6, который можно использовать аналогично тому, как вы будете использовать выражения функций. Другими словами, вы можете часто использовать их вместо выражений типа function (foo) {...}. Но у них есть некоторые важные отличия. Например, они не связывают свои собственные значения this (см. Ниже для обсуждения).

Функции Arrow являются частью спецификации ECMAscript 6, но не являются частью «нормального» JavaScript, используемого в большинстве браузеров сегодня. Однако они частично поддерживаются в Node v. 4.0 + и во многих браузерах (см. Ниже).

Вы можете прочитать больше в документации Mozilla о функциях стрелок .

Из документации Mozilla:

Выражение функции стрелки (также называемое функцией толстой стрелки) имеет более короткий синтаксис по сравнению с выражениями функции и лексически связывает значение this (не связывает его this , arguments , super или new.target ). Функции стрелок всегда анонимны. Эти функциональные выражения лучше всего подходят для функций, отличных от метода, и они не могут использоваться в качестве конструкторов.

Примечание о том, как this работает в функциях стрелок

из наиболее удобных функций функции стрелки похож на текст выше:

Функция стрелки ... лексически связывает значение this (не связывает его this. .)

. Это проще означает, что функция стрелки сохраняет значение this из своего контекста и не имеет своего this. Традиционная функция связывает свое this значение, требуя большого количества гимнастики, такой как self = this; и т. Д., Для доступа или манипулирования this от одной функции внутри другой функции. Для получения дополнительной информации по этой теме см. объяснение и примеры в документации Mozilla .

Пример кода

Пример (также из документов):

var a = [
  "We're up all night 'til the sun",
  "We're up all night to get some",
  "We're up all night for good fun",
  "We're up all night to get lucky"
];

// These two assignments are equivalent:

// Old-school:
var a2 = a.map(function(s){ return s.length });

// ECMAscript 6 using arrow functions
var a3 = a.map( s => s.length );

// both a2 and a3 will be equal to [31, 30, 31, 31]

---

Замечания о совместимости

Вы можете использовать функции стрелок в узле, но поддержка браузера является пятнистой.

Поддержка браузера для этой функции улучшилась немного, но он по-прежнему недостаточно распространен для большинства браузеров. По состоянию на 12 декабря 2017 года он поддерживается в текущих версиях:

• Chrome (v. 45 +)
• Firefox (версия 22 +)
• Edge (v. 12 +)
• Opera (v. 32 +)
• Android Browser (версия 47+)
• Opera Mobile (v 33 +)
• Chrome для Android (v. 47 +)
• Firefox для Android (версия 44 +)
• Safari (v. 10+)
• iOS Safari (v. 10.2 +)
• Samsung Internet (v. 5 +)
• Baidu Browser (v.7.12 +)

Не поддерживается в:

• IE (через v. 11)
• Opera Mini (через v. 8.0)
• Blackberry Браузер (через v. 10)
• IE Mobile (через v. 11)
• UC Browser для Android (через 11.4)
• QQ (через v 1.2)

Вы можете найти больше (и более актуальную) информацию на странице CanIUse.com (без аффилиации).