Функции

Зачастую нам надо повторять одно и то же действие во многих частях программы.

 

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

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

alert(message),

prompt(message, default), 

confirm(question).

Но можно создавать и свои

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

function showMessage() {
  alert( 'Всем привет!' );
}
function имя(параметры) {
  ...тело...
}

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

Функция может быть вызвана по её имени: showMessage().

Например:

function showMessage() {
  console.log( 'Всем привет!' );
}

showMessage();
showMessage();

Всем привет!

Всем привет!

Локальные переменные

Переменные, объявленные внутри функции, видны только внутри этой функции.

function showMessage() {
  let message = "Привет, я JavaScript!";

  alert( message );
}

showMessage(); // Привет, я JavaScript!

alert( message ); // Error

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

Но у функции есть доступ к внешним переменным

let userName = 'Вася';

function showMessage() {
  let message = 'Привет, ' + userName;
  alert(message);
}

showMessage(); // Привет, Вася

Внешняя переменная используется, только если внутри функции нет такой локальной.

let userName = 'Вася';

function showMessage() {
  userName = "Петя";
  
  alert(userName);
}

alert( userName ); // Вася 

showMessage();	   // Петя

alert( userName ); // Петя
let userName = 'Вася';

function showMessage() {
  let userName = "Петя";
  
  alert(userName);
}

alert( userName ); // Вася 

showMessage();	   // Петя

alert( userName ); // Вася

Параметры

function showMessage(from, text) { 
  alert(from + ': ' + text);
}

showMessage('Аня', 'Привет!'); // Аня: Привет!
showMessage('Аня', "Как дела?"); // Аня: Как дела?

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

function showMessage(from, text) { 
  alert(from + ': ' + text);
}

showMessage('Аня'); // Аня: undefined
function showMessage(from, text='нет текста') {
  alert(from + ': ' + text);
}

showMessage('Аня'); // Аня: нет текста

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

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

function sum(a, b) {
  return a + b;
}

let result = sum(1, 2);
alert( result ); // 3

Одна функция – одно действие

 

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

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

Function Expression

Function Declaration

function sayHi() {
  alert( "Привет" );
}
let sayHi = function() {
  alert( "Привет" );
};

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

let func = (arg1, arg2, ...argN) => expression
let sum = (a, b) => a + b;

/* Более короткая форма для:

let sum = function(a, b) {
  return a + b;
};

*/

alert( sum(1, 2) ); // 3

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

// тоже что и
// let double = function(n) { return n * 2 }
let double = n => n * 2;

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

sayHi();
let sum = (a, b) => { 
  let result = a + b;
  return result; 
};

alert( sum(1, 2) ); // 3

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

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

Все...

Made with Slides.com