Стрелочные функции

Стрелочные функции стали частью спецификации JavaScript с выпуском ECMAScript 2015 или, как многие из нас знают, ES6. Давайте посмотрим, что это такое и как они работают.

Функции

Сначала поговорим о функциях. Вы, вероятно, знаете, что это такое, но если нет, то вот краткий обзор:

Функции можно описать как «подпрограммы», которые выполняют некоторые операции. Они могут принимать аргументы — значения, которые функция может использовать в своих операциях. Функция завершает свое выполнение, возвращая значение. Если возвращаемое значение не указано, функция возвращает undefined.

//Здесь мы объявляем нашу функциюfunction hello (name) {//функция принимает параметр имени return "Hello,"  + имя; //выводит слово hello, за которым следует значение name} console.log (//Это вызов нашей функции hello ("Earth")//Мы передаем "Earth" в качестве значения параметра name);//Запустите код, чтобы увидеть результат! 

Вот пример функции.

Стрелочные функции

Стрелочные функции — более лаконичная альтернатива регулярным функциональным выражениям. Давайте напишем нашу функцию hello , используя синтаксис стрелок:

 let hello = name => "Привет," + name; console.log (hello ("Earth")); 

Это было немного короче, верно? Если стрелочная функция принимает только один параметр, нам даже не нужны круглые скобки! Обратите внимание, однако, что для любого другого количества параметров (включая отсутствие вообще) круглые скобки необходимы:

 let hello = (firstName, lastName) => `Привет, $ {firstName +" "+ lastName}`; console. log (hello ("Планета", "Земля")); 

Если вам интересно, способ добавления аргументов внутри строки называется интерполяцией строки. Это тоже функция ES6!

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

 let hello = (firstName, lastName) => {let fullName = firstName + "" + lastName;  return fullName;} console.log (hello ("Планета", "Земля")); 
путь>

путь>

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

 let getObject = () => {name: "Earth", planet: true} console.log (getObject ()); 

Это не сработает.

Если мы хотим немедленно вернуть литерал объекта вне оператора блока нам нужно заключить его в круглые скобки:

 let getObject = () => ({name: "Earth", planet: true}); console.log (getObject ()); 

Теперь вы можете подумать, что стрелочные функции кажутся не очень более лаконичны, чем обычные функции. Это потому, что все, что мы написали до сих пор, — это очень простые функции. Стрелочные функции действительно сияют как обратные вызовы. Чтобы проиллюстрировать это, я создам и обработаю Promise. Обратите внимание, что это недопустимое использование обещания. Я просто пытаюсь донести мысль.

 function isEven (x) {return new Promise (function (resolve, reject) {if (! (x% 2)) resolve ("EVEN"); else reject ("ODD");}  );} isEven (8) .then (function (res) {console.log (res);}). catch (function (res) {console.log (res);}); 

Это довольно многословно, правда? Давайте перепишем наш код с помощью стрелочных функций:

 let isEven = x => new Promise ((resolve, reject) => {if (! (x% 2)) resolve ("EVEN"); else reject ("ODD");})  ; isEven (8) .then (res => console.log (res)) .catch (res => console.log (res)); 

Теперь так лучше. Если вам сложно читать новый код, не волнуйтесь. Все, что вам нужно, это практика использования синтаксиса стрелок 😃

Это еще не все…

Лаконичность — не единственное, что отличает стрелочные функции от регулярных функциональных выражений. Еще одно отличие состоит в том, что, в отличие от своих предшественников, стрелочные функции не имеют собственных аргументов this или . Чтобы узнать больше о функциях стрелок, щелкните здесь.

Предупреждение

Стрелочные функции плохо подходят для определенных вещей, таких как методы объекта. Чтобы узнать больше о том, когда не следует использовать стрелочные функции, щелкните здесь.

Вы только что дочитали мой первый снимок EdPresso! Если вы хотите увидеть больше в будущем, подпишитесь на меня в Twitter и LinkedIn! Пока вы занимаетесь этим, почему бы не заглянуть и на мой сайт?

Оцените статью
nanomode.ru
Добавить комментарий