Сколько параметров можно передать функции javascript

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

В первом случае — получаем результат работы функции.

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

Внешние переменные

Давайте возьмем пример выше. Оставим внутри функции значение переменной message . А за пределами функции заведем другую переменную и назовем ее message .

Пример кода с локальной и внешней переменной

function showMessage() < let message = "Я локальная переменная"; // локальная переменная alert( message ); >let message = "Я внешняя переменная" showMessage(); // Я локальная переменная alert( message ); //Я внешняя переменная 

В коде у нас две переменные с одинаковым именем. Но наш сценарий будет считать их разными переменными.

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

Параметры по умолчанию

Когда мы указали параметр и не присвоили ему аргумент, то его значение будет undefined .

Пример кода с параметром по умолчанию

function showMessage(from, text) < // параметра: from, text alert(from + ', ' + text); >showMessage('Привет', ); // Привет, undefined 

В примере параметру text мы не передали значение аргумента. Поэтому в результате мы видим аргумент параметра from и undefined .

Возврат значения

Вернуть значение функции можно с помощью директивы return в теле функции. Например, напишем функцию, которая складывает два параметра.

Пример возврата значения функции с помощью директивы return

function sum(a, b) < return a + b; >let result = sum(1, 2); alert( result ); // 3 

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

Необходимо помнить, что после return выполнение операций в функции прекращается. Поэтому, с помощью return можно прерывать функции.

Функция, которая возвращает функцию

Функцию из предыдущего примера можно записать так:

Пример функции, которая возвращает функцию

const generateSumFinder = () => < const sum = (a, b) =>a + b; return sum; >; const sum = generateSumFinder(); sum(1, 5); 

1. Создали переменную generateSumFinder и присвоили ей значение стрелочной функции. Когда мы видим значок => , перед нами стрелочная функция.
2. Внутри функции создали переменную sum . Это локальная переменная и видна только внутри функции и присвоили ей значение стрелочной функции, которая складывает аргументы a и b.
3. Вернули переменную sum .
4. За пределами функции создали переменную sum . Это внешняя переменная и она не зависит от переменной внутри функции. Этой переменной мы присвоили значение функции generateSumFinder .

Рекурсия

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

function countdown (i) < if (i <=1)< return i; >else < return i-1 >; >; alert (countdown(1)); 

Функция будет вызываться каждый раз, пока значение ее параметра i больше 1 – это рекурсивный случай. Или вызывается при базовом случае при i

Перегрузка функций в JavaScript

У перегруженных функций одинаковые имена, но разные параметры. JavaScript не поддерживает перегрузку.

Пример функции без перегрузки

function overload(a) < console.log(«Параметр») >function overload(a,b) < console.log(«Два параметра») >overload(1); // Два параметра overload(1,2); // Два параметра 

Несмотря на то, что в первой функции один параметр, вывод аргументов этой функции выведет два параметра. Как вы помните, второй ее параметр будет undefined .

В JavaScript есть способы, как перегрузить функцию. Для этого используют метод arguments.length .

Пример функции с перегрузкой

function overload () < if (arguments.length === 1) < console.log(«Параметр») >if (arguments.length === 2) < console.log(«Два параметра») >> overload(1); // Один параметр overload(1, 2); // Два параметра 

В примере с помощью метода arguments.length мы узнаем количество параметров в функции и выводим столько параметров, сколько аргументов мы задаем.

Выбор имени функции

Чтобы выбрать имя функции, необходимо следовать правилам:

Использовать слова на английском языке

Использовать глаголы, потому что функция – это действие

Комментарии в функции

Комментарии нужны, чтобы кто-то кроме вас понимал, что происходит в функции.

Пример комментария в функции

function getDomNodesBySelector(selector) < return Array.from(document.querySelectorAll(selector)); >;// функция возвращает массив, который она возьмет из списка DOM узлов по указанному селектору. 

Замыкания

Замыкание – это функция, которая запоминает свои внешние переменные и может получить к ним доступ. В JavaScript все функции являются замыканиями. Замыкания позволяют функции работать с внешними переменными, даже если они изменились.

Пример замыкания функции на внешней переменной

let name = "Nikolay"; function sayHi() < alert("Hi, " + name); >name = "Irina"; sayHi();//Hi, Irina 

В примере функция sayHi() будет оперировать со вторым значением переменной name . Таким образом, функция замыкает свое действие на известной переменной, где бы не задали ее значение.

Пример замыкания функции на внутренней переменной

function makeWorker() < let name = "Nikolay"; return function() < alert(name); >; > let name = "Irina"; // create a function let work = makeWorker(); // call it work(); //Nikolay 

В примере функция makeWorker() замыкается на внутренней переменной name = "Nikolay" . Поэтому при инициализации переменных, следует обращать внимание, какая функция будет ими пользоваться и на какой из них будет замыкаться.

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

Функцию можно задать не только с помощью слова function . Есть способ короче, для этого используют значок => .

Пример функции, которая складывает параметры a и b

Если параметр в функции один, то скобки можно не писать.

Пример записи стрелочной функции с одним параметром n

let double = n => n * 2; alert(double(3))//6 

Если параметров нет, то пишут круглые скобки.

Пример стрелочной функции без параметров

let sayHi = () => alert("Hello!"); sayHi();//Hello! 

Лексика this

В стрелочных функциях нет лексики this. Если происходит обращение к this , его значение берется снаружи.

Пример использования this в стрелочной функции

let object = < title: "our object", students: ["Nikolay", "Irina", "Roma"], showList() < this.students.forEach( student =>alert(this.title + ': ' + student) ); > >; object.showList(); 

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

• видимость переменных;
• параметры и аргументы;
• стрелочные функции;
• лексика this;
• замыкания;
• рекурсия;
• колбэки.

Материалы по теме

Источник