Functions in JavaScript

Functions:

Functions are blocks of code designed to perform a specific task.
Functions can help organize the code, avoid repetition and reduce the complexity of the code.

1. Function Declaration: the function in the main code flow

To declare a function, you use the "function" keyword, followed by the function name, a list of parameters, and the function body as follows:

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

2. Function Expression: the function in the context of an expression

Function name: It must be a valid JavaScript Identifier. The function names are in camelCase like "getSum()".
"console.log()" is also a function to output a message to the console.

let getSum = function(a, b) {
  let result = a + b;
  return result;
};

Parameters vs Arguments: The terms parameters and arguments are often used interchangeably. However, they are essentially different.

When declaring a function, you specify the parameters. 
However, when calling a function, you pass the arguments.

3. Arrow functions

Syntactically compact alternative to a regular function expression.
Arrow functions can only be anonymous functions we cannot name an arrow function.

var welcomeStr = () => { 
            return "Welcome to ES6" 
};

All these functions do the same thing:

const isEven = function(num){    // regular function expression
    return num % 2 === 0;
}
const isEven = (num) => {         // arrow function with parens around param
    return num % 2 === 0;
}
const isEven = num => {            // no parens around param
    return num % 2 === 0;
}
const isEven = num => (            // implicit return
     num % 2 === 0;
)
const isEven = num =>  num % 2 === 0;  // one liner
)

Function Invocation:

The code inside the function will execute when something invokes(calls) the function:

1. Invocation by event:

function name(){
    alert('this is function');
}

2. Invocation by calling:

the function is triggered when it is called
function name(){
    const = 'my name is function';
}

name();

3. Self-Invoking Functions:

A self-invoking expression is invoked (started) automatically, without being called. Function expressions will execute automatically if the expression is followed by ()

(function (){
    let x = "Hey!!";
})();


The Return Statement:
Our function is now dynamic but it's performing only one task: sending results to the console. This can be useful for testing purposes but not more than that. It would be good if our function could return the value so we could do anything we want with it.

Returning a value :
The return statement is used to return a particular value from the function to the function caller. The function will stop executing when the return statement is called.

The return statement should be the last in a function because the code after the return statement will be unreachable.

function sum(x, y){
    return x+y
}

console.log(sum(1+9));

Returning using array :
In this example, we are returning multiple values by using the Array. Here, we are using the ES6 Array destructuring syntax to unpack the values of an array.

function getData(){
    let name = 'John',
         age = '19';
    return [name. age];

}

const [name, age] = getData();
console.log(name);
console.log(age);

Returning using Object :
In this example, we are returning multiple values by using the Object. Here, we are using the ES6 Object destructuring syntax to unpack the values of the object.

Comments

Popular posts from this blog

Preparing the ABAP developement environment for SAP BTP

Introducing RESTful Application Programming