Это пятый класс в нашей серии javascript. Если вы не читали предыдущие блоги, сначала ознакомьтесь с ними. На этом занятии мы узнаем о Fфункциях и функциональном программировании в javascript.

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

  1. Функциональное программирование — это парадигма программирования. Парадигма означает модальный или «тарика». Функциональное программирование — это метод написания программ.
  2. Это декларативная парадигма программирования. Декларативное программирование — это тип программирования, в котором определена логика, но не определен поток управления. Это означает, что он отвечает на вопрос что, но не отвечает на вопрос как.
  3. В декларативном программировании все уже сделано вроде сортировки, как будто нам не нужно писать код с нуля. Таким образом, мы можем легко отлаживать код.
  4. JavaScript — это язык, основанный на функциональном программировании.
  5. В функциональном программировании функции являются гражданами первого класса. Это означает, что все программы строятся путем применения и составления функций. Функции могут быть переданы в качестве аргумента или могут быть возвращены из других функций, как и любой другой тип данных. Это позволяет писать программы в декларативном стиле, где небольшие функции объединяются модульным образом. Например, см. приведенный ниже код:
function calc(){
    function add(a,b){
      return (a+b);
    }
    function sub(a,b){
      return (a-b);
    }
    return [add,sub];
}
console.log(calc()[0](12,12));
console.log(calc()[1](10,4));

//Output
< 24
< 6

Мы подробно обсудим этот код далее в этом блоге.

Функции

  1. Функции используются для модуляции кода.
  2. Функции — это набор операторов, которые выполняют задачу или вычисляют значение, но для того, чтобы процедура считалась функцией, она должна принимать некоторые входные данные и возвращать выходные данные, при этом существует некоторая очевидная связь между входными и выходными данными.
  3. Чтобы использовать функцию, вы должны определить ее где-то в той области видимости, из которой вы хотите ее вызвать.
  4. Функции имеют параметры и функции что-то возвращают. Так какие параметры? Параметры — это значения, которые мы присваиваем функциям, и функции выполняют над ними определенную задачу, а функции возвращают значение результата.
  5. В JS, если мы передаем переменную типа значения/примитивного типа данных в качестве параметра функции, она будет передана как значение, означающее, что если вы что-либо измените, то значение не изменится вне функции. В то время как с другой стороны аргументы объекта передаются путем совместного использования, что означает, что если свойства объекта изменены, это изменение повлияет на внешнюю часть функции. Мы изучим эти вещи глубже в этом блоге.
  6. После создания функции мы должны вызвать эту функцию.
  7. Пока мы не вызываем функцию, она не занимает память в основной памяти.
  8. Когда мы вызываем функцию, JS-движок создает стек вызовов, в котором хранится вызов функции и локальные статические переменные.
  9. Есть два слова, относящиеся к функции: 1) вызов функции и 2) определение функции. Вызов функции:мы можем понять вызов функции на примере того, что мы сидим в ресторане, как мы добираемся до официанта, хотим ли мы заставить официанта стоять все время или мы должны вызывать официанта всякий раз, когда мы это нужно? Точно так же, как этот вызов функции, мы записываем логику и всякий раз, когда или где бы она нам ни понадобилась, вместо того, чтобы вызывать эту логику или функцию. Определение функции. Определение функции означает определение функции или написание логики.

В javascript есть много типов функций:
1. Именованная функция
2. Безымянная функция / анонимная функция / функциональное выражение
4. Именованное функциональное выражение (NFE)
3 , Функция стрелки

Именованная функция

  1. Функция, имеющая имя, называется именованной функцией.
  2. Большинство людей используют этот тип функции.
  3. Они глобальны по своей природе до тех пор, пока они не определены в какой-либо другой функции.
  4. Мы определяем функцию, используя ключевое слово «функция».
  5. В именованной функции мы начинаем определение функции с ключевого слова function, затем пишем имя функции, затем пишем параметры внутри скобок, затем пишем логику функции внутри фигурных скобок, которая также известна как область действия функции.
  6. Например, см. приведенный ниже код:
//function defination
function display(name){
  console.log("Hello "+name);
}
display("Mohd Ahmad"); //function call
//Output
< Hello Mohd Ahmad

Итак, здесь мы определили функцию, имя которой display имеет переменную параметра с именем «name». Функция написания приветствия с именами в консоли. затем мы вызвали эту функцию через имя функции и присвоили значению параметра «Мохд Ахмад» строку, поскольку JS — это язык со свободной типизацией, поэтому мы можем задавать данные любого типа.

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

//function defination
function display(name){
  console.log("Hello "+name);
}
display("Mohd Ahmad"); //function call
window.display("Mohd Ahmad");
//Output
< Hello Mohd Ahmad
< Hello Mohd Ahmad

окно является корневым объектом. window представляет текущее окно, внутри которого отображается документ. И документ представляет собой HTML-страницу, содержащую различные типы тегов. Это похоже на дерево, которое называется DOM (объектная модель документа).

8. Мы можем определить две функции с одинаковыми именами, мы не получим никакой ошибки, но самая низкая функция переопределит другую функцию, которая определена выше этой функции. Это означает, что последняя функция с тем же именем будет выполнять другие, которые не будут выполняться. Например, см. приведенный ниже код:

//function defination
function display(name){
  console.log("Hello "+name);
}
function display(name){
  console.log("Good Morning "+name);
}
display("Mohd Ahmad");
//Output
< Good Morning Mohd Ahmad

9. Помните, Global is Evil, что это значит? означает, что если функция является глобальной, и многие разработчики работают над одним и тем же проектом, и они создали функцию с тем же именем, то будет работать только функция, которая написана в самой нижней части кода, что означает, что другие функции не будут выполняться, это почему функция не должна быть глобальной.

10. Существует принцип под названием «Принцип открытости и закрытости», согласно которому объекты (классы, модули, функции и т. д.) должны быть открыты для расширения, но закрыты для модификации. Это означает, что такая сущность может разрешить расширение своего поведения без изменения исходного кода. Если функция глобальна, любой может получить к ней доступ и изменить функцию, поэтому функция не должна быть глобальной.

Пункты 8, 9 и 10 являются недостатками названной функции.

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

function calc(){
  function add(a,b){
    return a+b;
  }
  function sub(a,b){
    return a-b;
  }
}

Теперь мы не можем получить доступ к функциям add() и sub() вне функции calc(). Но нам нужны эти функции, что мы можем сделать? Таким образом, мы можем вернуть add() и sub() из функции calc() в JavaScript. так:

function calc(){
  function add(a,b){
    return a+b;
  }
  function sub(a,b){
    return a-b;
  }
  return add; //return one function
}
console.log(calc()(10,20));


//Output
< 30

Вот как мы возвращаем функцию из функции и можем ее использовать. Но можем ли мы вернуть обе функции или более одной функции? Да, мы можем вернуть более одной функции. Вот как мы возвращаем более одной функции:

function calc(){
  function add(a,b){
    return a+b;
  }
  function sub(a,b){
    return a-b;
  }
  return [add,sub]; //return more then one function
}
console.log(calc()[0](10,20)); //[0] is the index of add function we had returned
console.log(calc()[1](10,20)); //[1] is the index of sub function we had returned

//Output
< 30
< -10

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

function calc(){
  function add(a,b){
    return a+b;
  }
  function sub(a,b){
    return a-b;
  }
  return {add:add,sub:sub}; //return more then one function
}
console.log(calc().add(10,20)); //.add is the key for add function we had returned
console.log(calc().sub(10,20)); //.sub is the key for sub function we had returned

//Output
< 30
< -10

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

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

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

var a = function(a,b){
  return a+b;
}
console.log(a(10,20));

//Output
< 30

Зачем использовать эти функции? Мы используем этот тип функции, когда нам действительно не нужно вызывать функцию, например:

setTimeout(function () {
   console.log("This is an anonymous function!");
   }, 1500);

//Output
< This is an anonymous function!

Здесь нам не нужно запоминать имя функции, потому что js обрабатывает эту функцию через 1,5 секунды, она запустит функцию.

Подъем анонимной функции

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

z(10,20);
var z= function(a,b){
  return a+b;
}

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

Давайте посмотрим на вывод:

<Uncaught TypeError: z is not a function

почему он говорит, что z не является функцией? давайте вспомним, что такое подъем? Подъем — это перевод определения переменной или функции в начало области видимости. Итак, здесь произошла переменная Hoisting. переменная с именем z определяется поверх области видимости и инициализируется значением undefined, поэтому z не является функцией, когда мы вызываем z как функцию, потому что после вызова мы присваиваем функцию в z. поэтому вывод такой: Анонимные функции никогда не поднимаются.

Анонимные функции могут быть очень удобны при разработке IIFE (мгновенно вызываемых функциональных выражений). Мы узнаем больше об этом в следующих блогах.

NFE (выражение именованной функции)

Это как анонимная функция. мы храним функцию внутри переменной без подъема в этом типе функции. Единственное отличие состоит в том, что у этих функций есть имена. Тогда почему бы нам не использовать названную функцию вместо NFE? Ответ: Scope. Из-за области действия мы используем эту функцию, потому что область действия этой функции будет привязана к этой переменной.

function calc(){
    var add = function add(x,y){
        return x+y;
    }
    var subtract = function sub(x,y){
        return x-y;
    }
    //return add,subtract; only last element will going to return;
    //return [add,subtract]; 
    return {"addition":add,"subtraction":subtract};
  }

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

Мы изучим функцию стрелки в следующем блоге.

На сегодня все, увидимся на следующем уроке.

Я хотел бы выразить благодарность Амиту Сриваставе, сэру Brain Mentors Pvt Ltd, за проведение таких полезных сессий.

Не стесняйтесь связаться со мной на Linked In: https://www.linkedin.com/in/mohd-ahmad-seemapuri/

Проверьте мой GitHub Для заметок: https://github.com/ahmad9652/MERN-Stack-Learning/tree/main/JS

Спасибо за чтение.