An In Depth Guide To Functions In JavaScript

in javascript, there many ways to create a function.

• function declaration

• function expression

• arrow function

• function invocation

Function Declaration

just like how a variable declaration binds a value to variable name, function declaration binds a function to a name or an identifier.

A function declaration is a function that is declared as a separate statement in the main code flow.

  syntax is as follows

function functionName(parameters){
//code block
}

examples

function name(){
console.log('What is your Name?');
}

function declaration in javaScript are hoisted to the top of the enclosing function or global scope. This means you can use the function before you declare it.

A function declaration consist of

• The name of the function or it is identifier followed by parenthesis

• A function body or the block of the statement required to perform a specific task enclosed in the function curly braces.

calling a Function

A function declaration binds a function to an identifier however, a function declaration does not ask the code inside the function body to run , it just declare the existence of the function. The code inside a function body runs or execute only when the function is called. You can call a function directly by using its name followed by parentheses (). If the function takes an argument you can pass them inside the parentheses separated by comma.

                greet world();

This function call execute the function body or all of the statement between the curly braces in the function declaration

         examples

    function greet(name){
  console.log('Hello ' + name);
}
greet('Binka'); // This will log: "Hello Binka"

Here's what's happening in this code:

Function Declaration: function greet(name){ ... } is declaring a function called greet that takes one parameter, name.

Function Body: Inside the function, there's a console.log statement. console.log is a function that prints whatever is inside the parentheses to the console (usually your browser's developer tools or your terminal).

String Concatenation: The + operator is used here for string concatenation.
function call: greet('Binka') This line of code is calling or invoking the function greet with argument 'Binka'
finally the greet function will log 'Hello Binka' to console.

PARAMETERS AND ARGUMENTS

So far the function we have created execute a task without an input. However, some function can take inputs and use the inputs to perform a task. When declaring a function we can specify its parameters. Parameters allow function to accept inputs and perform task using the inputs. We use parameters as placeholders for information that will be passed to the function when it is called.
syntax for declaring parameters in function declaration is as follows

function functionName(param1, param2, param3){
//.....
}

each parameter is separated by comma

   examples

function calculateArea(width, height) {
  console.log(width, height);
}

Now, let's break down the code:

Function Declaration: The code begins with function calculateArea(width, height) { ... }, which declares a function named calculateArea that takes two parameters: width and height.

Function Body: Inside the function, there's a console.log statement that logs the values of width and height to the console.

console.log(width, height);

This line of code will output the values of width and height to the console when the function is called with appropriate arguments.

It's important to note that the provided code only defines the function. To execute the function and see the output, you need to call it with specific arguments.

For example:

calculateArea(10, 5);

In this case, the function calculateArea is called with the arguments 10 and 5. The values 10 and 5 will be assigned to the width and height parameters respectively, and the function will log these values to the console.

RETURN

When a function is called, the computer will run through the function's code and evaluates the result of calling the function by default that the result is undefined.

function rectangleArea (width, height){
let area = width * width;
}
console.log(rectangleArea(5,7))

The function does not have a return statement. As a result, it won't return any value when called.
To fix this, we will need to add a return statement to the function to return the calculated area:

function rectangleArea(width, height) {
  let area = width * height;
  return area;
}

Now, the function will calculate the area of the rectangle based on the width and height parameters and return the result.

Calling the Function: The code includes a console.log statement that calls the rectangleArea function with arguments (5, 7). However, since the function doesn't return anything, the console.log statement will output undefined.

Return allows functions to produce output.