Понимание функций JavaScript | Кодементор

Этот пост изначально опубликован для мой блог.

Какова функция

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

Например, мы хотим вывести текст определенной песни.

function verse1() {
  console.log('First verse goes here');
}

function verse2() {
  console.log('Second verse goes here');
}

function chorus() {
  console.log('Chorus goes here');
}



verse1(); 
chorus(); 
verse2(); 
chorus(); 

Как видите, функцию chorus можно повторять сколько угодно раз.

Определяющая функция

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

function verse1() {
  console.log('First verse goes here');
}
verse1(); 


let chorus = function() {
  console.log('Chorus goes here');
};
chorus(); 

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

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

let chorus = function() {
  return 'Chorus goes here';
};
console.log(chorus()); 

function sum() {
  return 1 + 1;
}
console.log(sum()); 

Объем функций

Если вы объявляете переменную внутри функции, она не может быть утечкой вне этой функции. Но функция может обращаться к внешним переменным (глобальным переменным).

const amOut = 'Coming from outside';

function testScope() {
  const amIn = 'Coming from inside';

  console.log(amOut);
  console.log(amIn);
}

console.log(testScope()); 
console.log(amIn); 

Параметры против аргументов

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

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


console.log(sum(5, 7));

Аргументы функции по умолчанию

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

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


console.log(sum()); 


console.log(sum(6, undefined)); 

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

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

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

console.log(sum(5, 7, 6, 8)); 
console.log(sum()); 


function sum(...nums) {
  console.log(nums); 
  let total = 0;
  for (num of nums) {
    total += num;
  }
  return total;
}

console.log(sum(5, 7, 6, 8)); 
console.log(sum()); 
console.log(sum(5)); 
console.log(sum(5, 7)); 

Функция высокого порядка против функции обратного вызова

Функция высокого порядка — это функция, которая принимает другую функцию в качестве параметра, а функция обратного вызова — это функция, которая передается в другую функцию в качестве параметра.

function callback() {
  console.log('Coming from callback');
}

function highOrder(func) {
  console.log('Waiting for callback');
  func();
  console.log('Callback is called');
}

highOrder(callback);

Анонимная функция

Анонимная функция — это функция без имени.

const anoyms = function() {
  console.log('I am Anonymous function');
};

setInterval(anoyms, 2000);

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

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

const sum = function(a, b) {
  return a + b;
};
console.log(sum(5, 7)); 


const sum1 = (a, b) => {
  return a + b;
};
console.log(sum1(5, 7)); 


const sum2 = (a, b) => a + b;
console.log(sum2(5, 7));