Surely you have been using all kinds of functions, but it is possible that you may not know what exactly you are using, In this article, we are going to talk about Functions in JavaScript, Functions are the heart of javaScript, functions are said to be first-class citizens/objects, Let's understand things in detail

Function declaration / Function statement

//Example-1
function printValue(){
  console.log('hello')
 };

This piece of code is a function declaration/function statement/ function definition, It just means creating a function

Function expression

//Example-2
var b = function(){
  console.log('hello guys')
 };

The above way of declaring a function via an anonyms function and storing it in a variable is called function expression, It will be invoked as

b();

Difference between Function statement and Function expression

The difference between both of them is, Function statements are hoisted whereas function expressions are not hoisted. =>Why? Because when the code runs and at the time of memory allocation all the variables are assigned a default placeholder undefined, so as the variable b in the code below, and in case of function statement directly functions are stored in memory

//Example-3
one();
b();

function one(){
  console.log('one called')
};

var b = function(){
  console.log('b called')
};

In the above code, we wrote a function expression and a function statement and tried to access them before the declaration and the output is as follows

one called
//reference error b is not defined

This shows that function statements are hoisted and function expressions are not.

Anonymous Functions

A function with no name is an anonymous function, it's a function statement with no name

//Example-4
function(){
  console.log('hello')
};

But this results in an error because this is not a valid syntax to declare a function statement, a function statement always requires a function name. You may be wondering If we can't use them like this then what's the use case? Anonymous functions are used when we use functions as values, when we assign a function to a variable, for a use case you can refer to example-2.

Named Function expression

While using function expression, Instead of using anonymous function if we give some name to the function then it becomes named function expression. As the Example-2 is a function expression and the code below is a named function expression as we gave the name to the function

//Example-5
var b = function printer() {
  console.log('b called')
};

Parameters and Arguments

These both terms become confusing sometimes, The parameter is the name of the identifier you pass while declaring a function, whereas arguments are the value we pass while invoking a function

//Example-6
function validator(name){
  console.log(name)
 };
validator("Harsh");

//output
Harsh

Here the identifier name is a parameter and "Harsh" is the argument.

Arrow functions =>

ES-6 introduced a new and concise way of writing functions, which is using a fat arrow => notation

//Example-7
const area = (length, breadth) => {
  return length * breadth
};

The above code is a new way introduced in es-6 to write functions, writing function keyword is no longer needed and the return keyword is necessary if using braces

Consice body arrow function

JavaScript has several ways of writing arrow function, the most condensed form is a concise body arrow function. Function that needs a single parameter does not need that parameter to be enclosed in parenthesis, if parameters are zero, two, or more than two in that cases you need to wrap them in parenthesis If the function body is of a single line then the curly braces and the return keyword can be omitted

//Example-8
const area = side => side*side

Arrow functions have more things to be covered, I have just introduced them here. $$\\$$ Hope you will remember this whenever you see or write a function next time Thank you for the read, Let me know in the comments what are your feedbacks