ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ

JS Учебник

JS Старт JS Введение JS Установка JS Вывод JS Объявления JS Синтаксис JS Комментарии JS Переменные JS Операторы JS Арифметические JS Присваивание JS Типы данных JS Функции JS Объекты JS События JS Строки JS Методы строки JS Числа JS Методы числа JS Массивы JS Методы массива JS Сортировка массива JS Итерация массива JS Даты JS Форматы дат JS Методы получения дат JS Методы установки дат JS Математические JS Рандомные JS Булевы JS Сравнения JS Условия JS Switch JS Цикл For JS Цикл While JS Прерывание JS Преобразование типов JS Побитовые JS Регулярные выражения JS Ошибки JS Область действия JS Подъём JS Строгий режим JS Ключевое слово this JS Ключевое слово Let JS Ключевое слово Const JS Функции стрелок JS Классы JS Отладка JS Гид по стилю JS Лучшие практики JS Ошибки JS Производительность JS Зарезервированные слова JS Версии JS Версия ES5 JS Версия ES6 JS JSON

JS Формы

JS Формы Формы API

JS Объекты

Определения объектов Свойства объекта Методы объекта Доступ к объектам Конструкторы объектов Прототипы объектов Объект ECMAScript 5

JS Функции

Определения функций Параметры функции Обращение к функции Вызов функции Применение функции Закрытие функции

JS HTML DOM

DOM Введение DOM Методы DOM Документ DOM Элементы DOM HTML DOM CSS DOM Анимация DOM События DOM Слушатель событий DOM Навигация DOM Узлы DOM Коллекции DOM Узловые списки

JS Объектная модель браузера BOM

JS Окно JS Скрин JS Локация JS История JS Навигатор JS Всплывающее оповещение JS Тайминг JS Куки

JS AJAX

AJAX Введение AJAX XMLHttp AJAX Запрос AJAX Отклик AJAX XML Файл AJAX PHP AJAX ASP AJAX База данных AJAX Приложения AJAX Примеры

JS JSON

JSON Введение JSON Синтаксис JSON и XML JSON Типы данных JSON Анализ JSON Stringify JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP

JS и jQuery

jQuery Селекторы jQuery HTML jQuery CSS jQuery DOM

JS Примеры

JS Примеры JS HTML DOM JS HTML Input JS HTML Объекты JS HTML События JS Броузер JS Упражнения JS Викторина JS Сертификат

JS Справочники

JavaScript Объекты HTML DOM Объекты

JavaScript. Уроки для начинающих

JavaScript Определения функций


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

Вы можете использовать функцию declaration (объявление) или функцию expression (выражение).


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

Ранее в этом учебнике вы узнали, что функции объявляются со следующим синтаксисом:

function functionName(параметры) {
  // код для выполнения
}

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

Пример

function myFunction(a, b) {
  return a * b;
}
Попробуйте сами »

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


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

JavaScript функция также может быть определена с помощью expression (выражения).

Выражение функции может быть сохранено в переменной:

Пример

var x = function (a, b) {return a * b};
Попробуйте сами »

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

Пример

var x = function (a, b) {return a * b};
var z = x(4, 3);
Попробуйте сами »

Вышеуказанная функция на самом деле является анонимной функцией (функция без имени).

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

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


Конструктор Function()

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

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

Пример

var myFunction = new Function("a", "b", "return a * b");

var x = myFunction(4, 3);
Попробуйте сами »

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

Пример

var myFunction = function (a, b) {return a * b};

var x = myFunction(4, 3);
Попробуйте сами »

В большинстве случаев вы можете не использовать ключевое слово new в JavaScript.


Подъём функции

Ранее в этом учебнике вы узнали о "подъёме" (JavaScript Подъём).

Подъем (hoisting) - это стандартное поведение JavaScript по перемещению объявлений в верхнюю часть текущей области.

Подъем применяется к объявлениям переменных и к объявлениям функций.

Поэтому функции JavaScript могут быть вызваны до их объявления:

myFunction(5);

function myFunction(y) {
  return y * y;
}

Функции, определенные с помощью выражения, не поднимаются.


Самовызов функций

Выражения функций могут быть сделаны "самовызывающими".

Вызывающее себя выражение вызывается (запускается) автоматически, без вызова.

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

Вы не можете самостоятельно вызывать объявление функции.

Вы должны добавить круглые скобки вокруг функции, чтобы указать, что это выражение функции:

Пример

(function () {
  var x = "Hello!!";  // Я буду вызывать себя
})();
Попробуйте сами »

Вышеприведенная функция на самом деле является анонимной самовызывающейся функцией (функцией без имени).


Функции могут использоваться как значения

Функции JavaScript могут использоваться как значения:

Пример

function myFunction(a, b) {
  return a * b;
}

var x = myFunction(4, 3);
Попробуйте сами »

Функции JavaScript могут быть использованы в выражениях:

Пример

function myFunction(a, b) {
  return a * b;
}

var x = myFunction(4, 3) * 2;
Попробуйте сами »

Функции являются объектами

Оператор typeof в JavaScript возвращает "function" для функций.

Но функции JavaScript лучше всего описать как объекты.

Функции JavaScript имеют как свойства, так и методы.

Свойство arguments.length возвращает количество аргументов, полученных при вызове функции:

Пример

function myFunction(a, b) {
  return arguments.length;
}
Попробуйте сами »

Метод toString() возвращает функцию в виде строки:

Пример

function myFunction(a, b) {
  return a * b;
}

var txt = myFunction.toString();
Попробуйте сами »

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


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

Функции стрелок позволяют использовать короткий синтаксис для написания выражений функций.

Вам не нужно ключевое слово function, ключевое слово return и фигурные скобки.

Пример

// ES5
var x = function(x, y) {
  return x * y;
}

// ES6
const x = (x, y) => x * y;
Попробуйте сами »

Функции стрелок не имеют своего собственного this. Они не очень подходят для определения методов объекта.

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

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

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

Пример

const x = (x, y) => { return x * y };
Попробуйте сами »

Функции стрелок не поддерживаются в IE11 или более ранних версиях.