JavaScript Functions

What is a function?

A function is a set of statements that performs a task or calculates a value. [MDN]

Declaring a function

function hello(){
    console.log("Hello!");
}

we use the "function" keyword to declare a function followed by the function name ("hello"). The body of the function is written inside curly braces. The () are for passing parameters in our case we didn't need one.

ES6 Way

const hello = () => {
    console.log("Hello");
}

This is a compact alternative to the traditional function declaration.

Calling a function

function hello(){
    console.log("Hello!");
}
hello(); // prints Hello!

Passing parameters to a function

function add(a,b){
    console.log(a+b);
}
add(2,3); // prints 5

passed two 2 numbers separated by "," as a parameter.

How do functions work?

function isOdd(x){
    if(x&1){
        return "Odd!"
    }else{
        return "Even!"
    }
}
let n = 6;
let res = isOdd(n);
console.log(res);

Javascript is a synchronous single-threaded language

which means it will execute one line at a time and will move to the next line only when it is finished executing the current line.

Internally we have 2 components in the execution context (EC). This entire box is called execution context. We have a memory part and a code part.

Initially, javascript scans all the lines and put them in memory.

Initially, variables are made undefined and functions are assigned whatever is inside the function as shown in the diagram above.

The execution starts after this point

After the code starts executing it starts with line 1 which is a function that it skips because the function will be executed when it is called then it moves to the next line where the function ends and sees n=6 it assigns value 6 to variable n in the memory. It moves to the next line and sees a function call now it creates another EC inside the current EC to execute this function. It again initializes x = undefined and then starts execution. It sees value 6 has been assigned to x so it initialises x = 6 and then runs the condition and returns the result. After it returns "Even!" this EC is deleted and moves back to the previous EC to execute the remaining code after which it prints "Even!" and this EC is also deleted.

Whenever javascript encounters a function call it creates another EC to execute that function.

For creation

Scope

the scope can be defined as the current context of execution where values or expressions are visible.

We have 3 types of scope in javascript

Global Scope: If a variable is in global scope it can be accessed from anywhere in the code.
Module Scope: When we want to use some variable from another module then we need to export them explicitly before importing them to be able to use them
Function Scope: Variables or expressions are only accessible within the function.

additionally, when we use let and const they have Block Scope

Block scope is created with {...} curly brackets.

Types of functions

Named Function

A named function is a normal function we write that has some name.
```
 function add(a,b){
     console.log(a+b);
 }
 add(2,3); // prints 5
```
Anonymous Function

An anonymous function doesn't have a name associated with it. It can only be accessed by a variable where it is stored as a value.

This is how we write the anonymous function.
```
 function(){
     console.log("Anonymous funcion");
 }
```
Here's a working example
```
 const superman = function(){
     console.log("superman!");
 }
 superman(); // prints superman!
```
we call the function by invoking superman().
Immediately Invoked Function

These functions run as soon as it is encountered and are unaffected by code which appears down in the script.
```
 (()=>{})() // arrow function
 (function(){})() // normal function
```
```
 ((a,b)=>{
   console.log(a+b);
 })(10,20);
```
First-class functions

The ability of a function to be:
1. Assigned to a variable.
2. Passed as an argument to another function.
3. Returned from another function.

are called first-class functions. These first-class functions are also called **first-class citizens.**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1672317727842/2362b525-137f-4397-9add-c57b213f7fb1.png align="center")

Higher Order Function (HOF)

HOF take function as an argument or returns a function.

for example, map, reduce, and filter all these take function as an argument so they're higher-order functions.

In the above example calculate function takes the diameter or area function depending on what is being called an argument thus acting as a higher-order function. This also helps to write clean and less code otherwise we would have to define logic inside each function.

Below is the output.

That concludes this article thanks for reading any feedback is welcomed.

THANK YOU