Что такое функция?
Функция — это последовательность кодовых инструкций, которая используется для выполнения задачи. Задачи могут включать в себя выполнение поручения, ответ на сообщение, поход в магазин, расчет предметов и т. д.
Функции обычно пишутся в блоке кода, следовательно, его можно использовать повторно. Это помогает нам соответствовать принципу DRY (не повторяйся).
Функция — это фундаментальное понятие в приложении Javascript.
Итак, как мы создаем функцию?
Создание/определение функции
Определение функции аналогично присвоению значения переменной, но синтаксис, используемый при определении функции, отличается от синтаксиса определения переменной.
Чтобы присвоить значение переменной , мы делаем это
const name = Damilola; var name = Damilola; let name = Damilola;
Синтаксис для определения функции длиннее, чем для определения переменной. Функция может быть определена с помощью следующих шагов
1. Функция начинается с ключевого слова.
Точно так же, как мы объявляем переменную с ключевым словом const, var или let, объявление функции также начинается с ключевого слова «функция».
2. Название функции
После ключевого слова функции следует имя функции. Это будет идентификатор для конкретной определяемой функции.
3. Скобка
Рядом с именем функции находится круглая скобка (в народе известная как скобка ()). Здесь мы вводим имя переменной значений, которые будут выполняться кодом.
4. Тело функции
После написания ключевого слова функции, имени функции и круглых скобок пришло время записать значение функции. Присвоение значения функции сильно отличается от присвоения значения обычной переменной. Равно (=) в переменной заменяется фигурными скобками ({}). Внутри фигурных скобок находится то, что известно как функциональный блок, и код, который должен быть выполнен, написан здесь. Это может быть блок кода/полные строки инструкций, которые работают.
Синтаксис для определения функции.
function function_name(parameters){
//function body
}
Пример функции, которая используется для отправки приветствия.
function greetMessage(){
console.log("Hello! How are you doing?”);
}
Вызов функции
Определение функции не завершено без выполнения функции, потому что, если выполнение не выполняется для созданной функции, то наша функция так же хороша, как если бы она не создавалась изначально. Процесс выполнения функции называется «вызовом функции» (его также можно назвать запуском функции или вызовом функции).
Синтаксис:
имя_функции();
function_name();
Чтобы вызвать функцию приветствияMessage выше, мы пишем
greetMessage(); //Hello! How are you doing?
Как только функция определена, ее можно использовать в любой части нашего кода без ограничений на количество вызовов.
Например, функцию приветствияMessage можно вызывать столько раз, сколько мы хотим в нашем коде, то есть ее можно использовать повторно.
Аргумент и параметр
Аргумент и параметр — это данные, передаваемые в функцию, чтобы мы могли вернуть вывод. Аргумент и параметр — это два похожих термина, которые взаимозаменяемо используются в javascript и могут привести к путанице. Здесь будет объяснено отдельное значение аргумента и параметра.
Параметр
Параметр — это значение, которое используется в качестве заполнителя при определении функции. Параметром можно назвать имя переменной, которое используется в качестве заполнителя для фактических значений, которые будут переданы в функцию, в которой они записаны, т. е. они могут использоваться только в этой конкретной функции.
Обычно параметром является пишется в круглых скобках рядом с именем функции. мы можем иметь более одного параметра в функции.
Аргумент
Аргументы — это фактические значения параметра, которые будут выполняться при вызове функции. Всякий раз, когда параметр назначается функции, обязательно также присваивать значения (аргументы) каждому параметру при вызове функции.
Синтаксис
//defining the function
function function_name(parameters){
//function body
}
//calling the function
function_name(arguments)
Пример функции, вычисляющей возраст человека. Здесь мы передаем данные, которые потребуются для расчета возраста.
function calculateAge(birthYear, currentYear){
let age = currentYear - birthYear;
return age;
}
В функции calculateAge параметры «birthYear» и «currentYear» передаются в функцию.
Приведенный выше пример функции calculateAge можно вызывать с разными значениями.
calculateAge(2005,2023); //18 calculateAge(2011,2023); //12 calculateAge(2003, 2023); //10
Из-за свойства повторного использования функции, различные аргументы (значения) назначаются параметрам «birthYear» и «currentYear», следовательно, мы получаем разные выходные данные для каждой вызываемой функции.
📝Примечание
1. Важно вызвать функцию, иначе функция не будет выполнена.
2. Функция должна вызываться только там, где нам нужно, чтобы она выполнялась.
3. Нет ограничений на количество вызовов функции, т. е. мы можем вызывать функцию столько раз, сколько захотим, но существуют правила, определяющие, как мы размещаем/организуем нашу функцию и где они вызываются.
Всякий раз, когда аргументы и параметры используются в функции, мы можем использовать их как выражение (т.е. фрагмент кода, который создает значение) для выполнения различных операций в нашем блоке кода, таких как
1. Использование литерала шаблона, содержащего параметры, для создания значения.
Пример: функция, которая возвращает имя человека.
function introduceSelf(name){
return `I am ${name}, nice to meet you`;
}
introduceSelf("Damilola");
//I am Damilola, nice to meet you
2. Выполните математические операции.
Пример: Рассчитать возраст человека
function calculateItems(books, ruler, eraser){
return `The total number of available items is ${books + eraser + ruler}`;
}
calculateItems(2, 3, 4);
//The total number of available items is 9
Вернуть ключевое слово
Точно так же, как важно вызвать функцию для ее выполнения, также важно использовать ключевое слово return для возврата значений выражений в теле функции, чтобы операция могла быть выполнена при вызове функции, иначе функция вернет неопределенный
Пример
С ключевым словом return — функция будет выполнена.
function calculateAge(birthYear, currentYear){
let age = currentYear - birthYear;
return age;
}
calculateAge(2005, 2003);
//18
Без ключевого слова return — функция вернет неопределенное значение.
function calculateAge(birthYear, currentYear){
let age = currentYear - birthYear;
}
calculateAge(2005, 2003);
//undefined
📝Примечание
Функции без параметров и аргументов не нуждаются в ключевом слове return.
Различные способы определения функции
Существуют различные способы определения функции. Они включают
1. Объявление функции
Объявление функции соответствует обычному способу написания функции, т. е. включает ключевое слово функции, имя функции, круглые скобки, может включать или не включать аргумент и параметр.
function calculateAge(birthYear, currentYear){
let age = currentYear - birthYear;
return age;
}
calculateAge(2005,2023); //18
2. Выражение функции
В функциональном выражении объявленная функция хранится в функции. Функциональным выражениям не присваивается имя функции, вместо этого они используют имя переменной, которой они назначены. Ее также можно назвать анонимной функцией. Функция может быть присвоена имени переменной, потому что это выражение (т.е. оно производит значение).
Выражение функции вызывается так же, как и объявление функции.
Синтаксис
const function_name = function(parameters) {
//function body
}
function_name(arguments);
Пример
const calculateItems = function(book, coat, eraser){
return `The total number of available items is ${books + eraser + ruler}`;
}
calculateItems(2, 3, 4);
//The total number of available items is 9
📝Примечание
Важное различие, которое следует отметить между объявлением функции и выражением функции, заключается в том, что когда мы вызываем объявление функции до того, как они определены в коде, оно будет выполнено, но выражения функции не будут выполняться, если они вызываются до того, как они определены в коде. . Это связано с концепцией под названием ПОДЪЕМ.
3. Функция стрелки
Стрелочная функция — это форма выражения функции, использующая более короткий синтаксис.
Синтаксис
const function_name = parameter => //function body
Вот пример функции
const introduceSelf2 = name => `I am ${name}, nice to meet you`;
introduceSelf2("Victoria");
//I am Victoria, nice to meet you
Вот пример стрелочной функции с несколькими строками кода.
Функция «numberOfYearsLeft» подсчитывает, сколько лет вам осталось до 50 лет. ;
const numberOfYearsLeft = birthYear => {
const age = 2023 - birthYear;
const semiCentennial = 50 - age;
return semiCentennial;
}
Следует отметить следующее о стрелочных функциях.
Минусы
1. Стрелочные функции обычно не нуждаются в фигурных скобках для определения блока кода, за исключением случаев, когда нам нужно написать более одной строки кода, нам нужно использовать фигурные скобки.
2. Возврат происходит неявно, поэтому нам не нужно самим писать ключевое слово return при использовании стрелочной функции, за исключением случаев, когда у нас более одной строки кода. Это связано с тем, что это может вызвать неоднозначность в отношении того, какая строка кода должна быть возвращена.
Плюсы
1. Вызывается так же, как и другие функции.
2. когда мы используем один параметр, нам не нужны скобки. В случае нескольких параметров нам нужно заключить наши параметры в круглые скобки.
Очки, чтобы помнить
1. Параметры используются при определении функции, а аргументы используются при вызове функции.
2. Не забудьте ключевое слово return, иначе функция будет неопределенной.
3. Любая вызываемая функция должна быть вызвана для ее выполнения.
4. Объявление функции может быть вызвано до того, как оно будет определено, в то время как выражение функции не может быть вызвано концепцией, известной как ПОДЪЕМ.
5. Стрелочная функция — это ваша функция для более короткого синтаксиса.
6. Ни один из различных типов функций не ограничен использованием аргумента и параметра.
7. Любой тип функции можно использовать в соответствии с вашими предпочтениями, но важно понимать, как работает каждый тип функции, поскольку каждый из них имеет свой собственный способ работы.
Молодцы, что нашли время, чтобы изучить важную концепцию в javascript. Вы на шаг ближе к тому, чтобы стать отличным разработчиком JavaScript😎!
Поделитесь этой информативной частью со своими друзьями, приятелями по программированию, сообществами и многими людьми, которым это может понадобиться. Не забудьте включить кнопку уведомления, чтобы не пропустить мои следующие статьи о расширенных функциях и других концепциях JavaScript💯.
Если у вас есть какие-либо вопросы, вы можете связаться со мной через Twitter(@1_and_only_lola) и linkedIn(@Oniyide Damilola).
