Для чего на самом деле нужны стрелочные функции в JavaScript

Моя цель - предложение широкого ассортимента товаров и услуг на постоянно высоком качестве обслуживания по самым выгодным ценам.

Привет, Хабр! Представляю вашему вниманию перевод статьи «The real reason why JavaScript has arrow functions» автора Martin Novák.


* фраза-мем из игры Skyrim

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

Это пример того же кода, написанного также и в традиционном стиле:

const arrowFunction = (arg1, arg2) => arg1 + arg 2;

const traditionalFunction = function(arg1, arg2) {
  return arg1 + arg2;
};

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

const arrowFunction = (arg1, arg2) => {
  const result = arg1 + arg2;
  return result;
};

Стрелочные функции также часто называют лямбда-функциями и они используются не только в JavaScript. Язык Python может послужить хорошим примером где также встречаются лямбда-функции.

В Python их синтаксис выглядит следующим образом:

lambdaFunction = lambda a, b : a + b

Упрощай


Использование стрелочных функций мотивирует вас упрощать код в соответствии с KISS принципом (Keep-it-simple-stupid) и принципом единственной ответственности (каждая функция отвечает только за одно конкретное действие).

В целом, я пишу их без фигурных скобок {}. Если функцию тяжело читать или в ней нужно применить несколько выражений, советую разбить ее на несколько более мелких.
Данный код проще в написании, удобнее в повторном использовании и тестировании. Также, функции могут получать более описательные имена, чтобы точно показать работу, которую они выполняют.

Функции первого класса


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

document.querySelector('#myButton').addEventListner('click', function() {
  alert('click happened');
});

Здесь показана анонимная функция, переданная как аргумент в addEventListener. Данный метод часто применяется в Javascript для колбэков.

Пример возвращения функции другой — представлен ниже:

const myFirstClassFunction = function(a) {
  return function(b) {
    return a + b;
  };
};

myFirstClassFunction(1)(2); // => 3

Однако, со стрелочной функцией, все выглядит гораздо “чище”:

const myFirstClassArrow = a => b => a + b;

myFirstClassArrow(1)(2); // => 3

Здесь все просто: то, что написано до последней стрелки — аргументы, а после нее — вычисление. По факту, мы работаем с несколькими функциями, а также мы можем использовать несколько вызовов fn(call1)(call2);

Частичное применение


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

const add = a => b => a + b;

const increaseCounter = counter => add(1)(counter);
increaseCounter(5); // => 6

const pointFreeIncreaseCounter = add(1);
pointFreeIncreaseCounter(5); // => 6

Это похоже на использование функций с переменными по умолчанию, но частичное применение дает больше гибкости.

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

Функциональное программирование


Как вы могли уже догадаться, основная причина появления стрелочных функций это функциональное программирование. Это парадигма декларативного стиля, основанная на композиции простых функций.

Функциональное программирование это альтернатива ООП, которое предпочитают многие разработчики (включая автора статьи). Вы можете привести аргументы в защиту любого стиля, но я считаю — функциональное программирование — крутая штука и вам должно становиться не по себе от одной только мысли, что вы когда-то думали по-другому.

Чистые функции полагаются только на входные данные и всегда возвращают какое-то значение. Они никогда не изменяют (мутируют) другие переменные и не зависят внешних данных, за пределами входных значений. Это приводит к ссылочной прозрачности, которое упрощает программирование.

И да, всегда есть возможность писать огромное количество кода, не изменяя ни одной переменной.

Как вы могли заметить, стрелочные функции призваны трансформировать данные между входом и выходом. Им даже не нужно возвращать выражение в короткой записи без фигурных скобок.

Стрелочные функции — заключение


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

Реальный функциональный пример


Чтобы понять, что же скрывается в кроличьей норе, давайте взглянем на пример использования open-source библиотеки @7urtle/lambda

import {trim, upperCaseOf, lengthOf, lastLetterOf, includes, compose} from '@7urtle/lambda';

const endsWithPunctuation = input =>
  includes(lastLetterOf(input))('.?,!');

const replacePunctuationWithExclamation = input =>
  substr(lengthOf(input) - 1)(0)(input) + '!';

const addExclamationMark = input =>
  endsWithPunctuation(input)
    ? replacePunctuationWithExclamation(input)
    : input + '!';

const shout = compose(addExclamationMark, upperCaseOf, trim);

shout(" Don't forget to feed the turtle.");
// => НЕ ЗАБУДЬ ПОКОРМИТЬ ЧЕРЕПАХУ!

Использование стрелочных функций и изучение функционального программирования очень затягивает. Это позволяет писать короткий код с лучшей производительностью и возможностью переиспользования.

JavaScript может быть сложным в его непоследовательности между использованием Си-подобного синтаксиса и особенностей функционального программирования. Чтобы помочь людям лучше разобраться и предоставить доступ к материалам для изучения, я разработал библиотеку @7urtle/lambda. Вы можете освоить функциональное программирование в своем ритме и сайт www.7urtle.com поможет вам изучить данную парадигму, предоставив вам все необходимые инструменты.
Источник: https://habr.com/ru/post/529232/

Интересные статьи

Интересные статьи

Недавно на проекте интегрировал модуль CRM Битрикса c виртуальной АТС Ростелеком. Делал по стандартной инструкции, где пошагово показано, какие поля заполнять. Оказалось, следование ей не гаран...
Всем привет, меня зовут Ростислав, я занимаю должность Front Lead в компании ДомКлик. Хочу поделиться с вами опытом создания Front Core команды и сразу ответить на следующие вопросы...
Доброго времени суток, друзья! Представляю вашему вниманию перевод статьи Apal Shah «Common Javascript Promise mistakes every beginner should know and avoid». Распространенные ошибки пр...
10 октября мы провели JavaScript Meetup SuperJob. Рассказываем, что обсуждали участники, делимся видео и презентациями.
Итак, у вас есть приложение с автоматическими возобновляемыми подписками. Оно прекрасно работает, пользователи безудержно оформляют премиум подписки и пишут хвалебные отзывы. Красота! Всем при...