javascript передача параметров в функцию javascript

Форум

Справочник

Функции

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

Создание функций

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

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

В примере нельзя было сделать присвоение:

Области видимости

Каждая функция, точнее даже каждый запуск функции задает свою индивидуальную область видимости.

Параметры функции

Функции можно запускать с любым числом параметров.

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

Работа с неопределенным числом параметров

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

Вызвать функцию для массива аргументов можно при помощи apply :

Пример передачи функции по ссылке

Функцию легко можно передавать в качестве аргумента другой функции.

Или можно создать анонимную функцию непосредственно в вызове map :

Сворачивание параметров в объект

Бывают функции, аргументы которых сильно варьируются.

Вызов с необязательными параметрами приходится делать так:

Чтобы избежать лишних null и сделать код более понятным, используют нечто вроде «keyword arguments», существующих в Python и Ruby. Для этого много параметров пакуют в единый объект:

Вызов теперь делается гораздо проще:

Кроме того, с объектом можно удобнее делать последовательности вызовов вроде:

Конечно мне всё описанное в статье уже известно, но материал очень полезный.
Жаль, что в то время, когда я только начинал изучать программирование и JavaScript, не было таких статей.

Да, статьи у тебя, Илья, как всегда, полезны. Доходчиво написано, особенно для новичков.

Есть маленькое уточнение:

не каждая именованная функция является declaration’ом:

Для новичков.
Вот я новичок. И я ничерта не понял) После второго абзаца мозг расплавился.
Хотя я пытался выяснить простую вещь: почему в функцию передается число и не передается текст? Но этого тут я так и не нашел =\

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

Спасибо огромное! Очень долго искал вот это для своей JS библиотеки:

Поддержу, отличный метод

А как все таки задавать значения параметров по умолчанию?
Только уже в самом теле функции?

Да, только в теле функции

Блин, а я как не разбиралась в Яве, так и не разбираюсь. Надо учиться

или последнее, которое приводится к false

Никак. Элементарные значения не передаются по ссылке, только объекты, к которым также относятся массивы, даты и т.п.

Здесь javascript ведет себя так же, как, например, java/php5

А вот и неправда, можно привести их к object и передать в функцию, тогда они будут переданы по ссылке

Я правильно понимаю?

Да, Ты понимаешь правильно
пиши так:
function myFunc(s)
<
if (typeof s == «undefined») s = «default value for s»;
alert(s);
>;

Не понятно про имена функций при вызове по ссылке. Мы можем сослатся на функцию вот так:

Тоесть мы переменную myFunc фактически приравниваем к функции.
Но мочему тогда нельзя сделать вот так?

Привет. Присвоение значения переменной надо делать без кавычек:
var someVar = myFunc;

Спасибо за ответ, но. 🙂

Суть именно в том, что в кавычках вычесляется имя функции, которую нужно запустить. Кавычки тут не зря. К примеру:

Только если записывать ф-ию в хеш (или объявлять ее глобально, что почти тоже самое: она попадет в объект window).

Источник

Руководство по JavaScript, часть 4: функции

Сегодня публикуем четвёртую часть перевода руководства по JavaScript, которая посвящена функциям.

Функции в JavaScript

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

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

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

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

Вот как выглядит объявление функции (function declaration).

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

Функцию можно назначить переменной или константе. Такая конструкция называется функциональным выражением (function expression).

Можно заметить, что в вышеприведённом примере функция назначена константе, но сама она имени не имеет. Такие функции называют анонимными. Подобным функциям можно назначать имена. В таком случае речь идёт об именованном функциональном выражении (named function expression).

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

В стандарте ES6 появились стрелочные функции (arrow function), которые особенно удобно использовать в виде так называемых «встроенных функций» (inline function) — в роли аргументов, передаваемых другим функциям (коллбэков).

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

Параметры функций

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

Здесь показано несколько примеров стрелочных функций.

Начиная со стандарта ES6 у функций могут быть так называемые «параметры по умолчанию» (default parameters).

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

В ES8 появилась возможность ставить запятую после последнего аргумента функции (это называется trailing comma). Эта возможность позволяет повысить удобство редактирования кода при использовании систем контроля версий в ходе разработки программ. Подробности об этом можно почитать здесь и здесь.

Передаваемые функциям аргументы можно представлять в виде массивов. Для того чтобы разобрать эти аргументы можно воспользоваться оператором, который выглядит как три точки (это — так называемый «оператор расширения» или «оператор spread»). Вот как это выглядит.

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

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

Значения, возвращаемые из функций

Если после ключевого слова return указать некое значение, то это значение возвращается в место вызова функции в качестве результата выполнения этой функции.

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

Конструкцию const [ name, age ] = doSomething() можно прочитать следующим образом: «объявить константы name и age и присвоить им значения элементов массива, который возвратит функция».
Вот как то же самое выглядит с использованием объекта.

Вложенные функции

Функции можно объявлять внутри других функций.

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

Методы объектов

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

Ключевое слово this

Как видно, вызов метода start() приводит ко вполне ожидаемому результату, а вот метод stop() явно работает неправильно.

Вот как выглядит выполнение такого кода в консоли браузера.

Особенности ключевого слова this в обычных и стрелочных функциях

Всё это означает, что стрелочные функции не подходят на роль методов объектов и конструкторов (если попытаться использовать стрелочную функцию в роли конструктора — будет выдана ошибка TypeError ).

Немедленно вызываемые функциональные выражения

Немедленно вызываемое функциональное выражение (Immediately Invoked Function Expression, IIFE) — это функция, которая автоматически вызывается сразу после её объявления.

Точка с запятой перед IIFE необязательна, но её использование позволяет застраховаться от ошибок, связанных с автоматической расстановкой точек с запятой.

Поднятие функций

Если переместить вызов функции так, чтобы он шёл после её объявления, ничего не изменится.

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

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

Сейчас мы подробнее поговорим о стрелочных функциях, с которыми мы уже встречались. Их можно считать одним из наиболее значительных новшеств стандарта ES6, они отличаются от обычных функций не только внешним видом, но и особенностями поведения. В наши дни они используются чрезвычайно широко. Пожалуй, нет ни одного современного проекта, где они не использовались бы в подавляющем большинстве случаев. Можно сказать, что их появление навсегда изменило и внешний вид JS-кода и особенности его работы.

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

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

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

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

▍Неявный возврат результатов работы функции

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

▍Ключевое слово this и стрелочные функции

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

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

Замыкания

Замыкания — это важная концепция в JavaScript. Фактически, если вы писали JS-функции, то вы пользовались и замыканиями. Замыкания применяются в некоторых паттернах проектирования — в том случае, если нужно организовать строгий контроль доступа к неким данным или функциям.

Когда функция вызывается, у неё есть доступ ко всему тому, что находится во внешней по отношению к ней области видимости. Но к тому, что объявлено внутри функции, извне доступа нет. То есть, если в функции была объявлена некая переменная (или другая функция), они недоступны внешнему коду ни во время выполнения функции, ни после завершения её работы. Однако если из функции возвратить другую функцию, то эта новая функция будет иметь доступ ко всему тому, что было объявлено в исходной функции. При этом всё это будет скрыто от внешнего кода в замыкании.

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

Значение, возвращаемое этой функцией нас пока не интересует, текст выводится в консоль с помощью IIFE, что в данном случае особой роли не играет, однако, это поможет нам увидеть связь между этой функцией и её вариантом, в котором, вместо вызова функции, которая выводит текст в консоль, мы эту функцию из переписанной функции bark() возвратим.

Результат работы код в двух случаях оказывается одинаковым. Но во втором случае то, что было передано исходной функции при её вызове (имя собаки, Roger ), хранится в замыкании, после чего используется другой функцией, возвращённой из исходной.

Проведём ещё один эксперимент — создадим, пользуясь исходной функцией, две новых, для разных собак.

Этот код выведет следующее.

Итоги

Уважаемые читатели! Как вы относитесь к стрелочным функциям в JavaScript?

Источник

JavaScript Параметры функции

Функция JavaScript не выполняет проверку значений параметров (аргументов).

Параметры и аргументы функции

Ранее в этом учебнике вы узнали, что функции могут иметь Параметры:

Правила параметров

Определения функций JavaScript не указывают типы данных для параметров.

Функции JavaScript не выполняют проверку типа на передаваемых аргументах.

Функции JavaScript не проверяют количество полученных аргументов.

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

Если функция вызывается с отсутствующими аргументами (меньше, чем объявлено), то отсутствующие значения имеют значение: не определено

Иногда это допустимо, но иногда лучше присвоить параметру значение по умолчанию:

Пример

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

Объект arguments

Функции JavaScript имеют встроенный объект, называемый объектом arguments.

Объект Argument содержит массив аргументов, используемых при вызове функции (вызывается).

Таким образом, вы можете просто использовать функцию, чтобы найти (например) наибольшее значение в списке чисел:

Пример

x = findMax(1, 123, 500, 115, 44, 88);

Или создайте функцию для суммирования всех входных значений:

Пример

x = sumAll(1, 123, 500, 115, 44, 88);

Аргументы передаются по значению

Параметры в вызове функции являются аргументами функции.

Аргументы JavaScript передаются по значению: функция только получает знать значения, а не местоположения аргумента.

Если функция изменяет значение аргумента, она не изменяет исходное значение параметра.

Изменения аргументов не отображаются (отражены) вне функции.

Объекты передаются по ссылке

В JavaScript ссылки на объекты являются значениями.

По этой причине объекты будут вести себя так, как будто они передаются по ссылке:

Если функция изменяет свойство объекта, она изменяет исходное значение.

Изменения свойств объекта видимы (отражены) вне функции.

Источник

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

Функции

Функции представляют собой набор инструкций, которые выполняют определенное действие или вычисляют определенное значение.

Синтаксис определения функции:

После имени функции в скобках идет перечисление параметров. Даже если параметров у функции нет, то просто идут пустые скобки. Затем в фигурных скобках идет тело функции, содержащее набор инструкций.

Определим простейшую функцию:

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

При вызове после имени вызываемой функции в скобках указывается список параметров. Если функция не имеет параметров, то указывются пустые скобки.

Например, определим и вызовем простейшую функцию:

В данном случае функция hello не принимает параметров, поэтому при ее вызове указываются пустые скобки:

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

Переменные и константы в качестве функций

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

Присвоив константе или переменной функцию:

затем мы можем по имени константы/переменной вызывать эту функцию:

Также мы можем динамически менять функции, которые хранятся в переменной:

Анонимные функции

Необязательно давать функциям определенное имя. Можно использовать анонимные функции:

Источник

Функции в JavaScript. Классический способ создания

Статья, в которой рассмотрим, что такое функция и зачем она нужна. Разберём классический способ её объявления, параметры, аргументы и оператор return.

Что такое функция

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

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

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

В результате такая программа становится более структурированной. В неё более просто вносить различные изменения и добавлять новые возможности.

В JavaScript создать функцию можно различными способами. Это:

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

Операции с функцией в JavaScript можно разделить на 2 шага:

При составлении имени функции необходимо руководствоваться теме же правилами, что и при создании имени переменной. Т.е. оно может содержать буквы, цифры (0-9), знаки «$» и «_». В качестве букв рекомендуется использовать только буквы английского алфавита (a-z, A-Z). Имя функции, также как и имя переменной не может начинаться с цифры.

Параметров у функции может быть сколько угодно много или не быть вообще. Круглые скобки в любом случае указываются. Если параметров несколько, то их между собой необходимо разделить посредством запятой. Они позволяют более удобно (по имени) получить переданные аргументы функции при её вызове.

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

Параметры и аргументы функции

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

Вызов функции sayWelcome без аргументов:

Получение аргументов через arguments в основном используется, когда мы заранее не знаем точное их количество.

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

Через цикл for. of этот пример можно записать так:

При необходимости мы можем arguments преобразовать в обычный массив. Как это выполнить показано в следующем примере:

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

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

При этом внешняя переменная или функция будет доступна внутри неё.

Передачи одной функции в другую. Колбэки

Узнать является ли некоторый идентификатор функцией можно с помощью typeof :

Например, проверим является ли колбэк функцией перед тем как его вызвать:

Возвращаемое значение (return)

Без использования return :

С использованием return :

Инструкции, расположенные после return никогда не выполняются:

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

В качестве результата функции мы можем также возвращать функцию.

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

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

Кроме этого в качестве результата мы можем также возвратить внешнюю функцию:

Рекурсия

Функцию можно также вызвать внутри самой себя. Это действие в программировании называется рекурсией.

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

Например, использование рекурсии для вычисления факториала числа:

Пример, в котором используя рекурсию выведем числа от указанного до 10:

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

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

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

Пример реализации «перегруженной» функции для вычисления оптимального количества ккал, которых необходимо человеку в день:

Новые возможности, которые появились в ES6+ для функций

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

В языке, начиная с версии ECMAScript 6+ (2015+) параметру функции можно задать значение по умолчанию.

Например, установим параметру color значение по умолчанию ‘#009688’ :

До появление такой возможности в языке, задание параметру значения по умолчанию выполнялось так:

Оставшиеся параметры (rest parameters)

Что такое встроенные (стандартные) функции

В JavaScript имеется огромный набор встроенных (стандартных) функций. Данные функции уже описаны в самом движке браузера. Практически все они являются методами того или иного объекта.

Например, для того чтобы вызвать встроенную функцию (метод) alert, её не надо предварительно объявлять. Она уже описана в браузере. Вызов метода alert осуществляется посредством указания имени, круглых скобок и аргумента внутри них. Данный метод предназначен для вывода сообщения на экран в форме диалогового окна. Текстовое сообщение берётся из значения параметра данной функции.

Такой же результат будет получен, если для оператора return не указать возвращаемое значение.

Источник