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

Введение

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

Функции в Javascript

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

Базовая функция в javascript состоит из следующих основных элементов:

  1. Имя. Представляет имя функции.
  2. Параметры. Это входные значения, которые может получить функция. Эти значения имеют локальную область действия.
  3. Тело: логика и реализация функции.
  4. Return: вывод результата функции.

Типы функций

В javascript есть несколько способов определить функцию, подчеркнув, что с годами добавлялось все больше и больше функций.

Вот различные способы использования функций в Javascript:

  • Объявление функции.
  • Выражение функции.
  • IFFE.
  • Функция стрелки.
  • Функция обратного вызова.

Далее мы рассмотрим определения и примеры каждой из этих форм.

Объявление функции

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

Эти функции широко используются в общих контекстах и ​​при повторном использовании кода.

function greeting(name) {
  return `Hello ${nombre}`;
}
console.log(greeting("Victor")); // Hello Victor

Выражение функции

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

Эти функции широко используются в обратных вызовах и изоляции элементов.

const sum = function (value1, value2) {
  return value1 + value2;
}
console.log(sum(5, 5)); // 10

IFFE

Это функция, которая при объявлении вызывается автоматически. Эта функция подчеркивает, что во время вызова они больше не доступны позже. Для его создания мы должны заключить его в оператор группировки «()» с последующим его выполнением, это позволит интерпретировать непосредственно в движке Javascript.

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

(function () {
  let name = 'Victor';
  console.log(`Hello ${name}`);
})();
// Hello Victor

Функция стрелки

Функция представлена ​​в функциях ES6 в 2015 году. Стрелочные функции позволяют использовать короткий синтаксис для написания функциональных выражений. Обратите внимание, что стрелочные функции являются анонимными и не имеют перехватчиков для аргументов, super и таких функций, как yield.

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

// Standard
const greeting = (name) => {  
  return `Hello ${name}`; 
}

// Shortcut
const greeting = (name) => `Hello ${name}`;

console.log(greeting("Foo")); // Hello Foo

Функция обратного вызова

Функция обратного вызова — это функция, которая передается в качестве аргумента другой функции. Эта функция предназначена для вызова в более позднее время.

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

const printAndCall = (name, callback) => {
  console.log(`Print ${name}...`);
  callback(name);
}

const call = (name) => {
  console.log(`Call ${name}...`);
};

printAndCall('Victor', call);
// Print Victor...
// Call Victor...

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

const button = document.getElementById('button');

button.addEventListener('click', () => {
  alert('click');
});

Функции ресурсов в Javascript

Окончание

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

Спасибо, что зашли так далеко, если вы найдете это полезным, не забудьте похлопать 👏. Подпишитесь, чтобы получать больше контента 🔔.

Если вам нужна дополнительная помощь, пожалуйста, свяжитесь со мной 🤠.

Большое спасибо за чтение, я ценю ваше время.