Function in Javascript

 

We can call the same function as many times as needed.

Imagine that you manage an online store. When a customer places an order, you send them a thank you note. Let’s create a function to complete this task:

• Define a function called sayThanks() as a function declaration.
• In the function body of sayThanks(), add code such that the function writes the following thank you message to the console when called: 'Thank you for your purchase! We appreciate your business.'

Call sayThanks() to view the thank you message in the console.

Functions can be called as many times as you need them.

Imagine that three customers placed an order and you wanted to send each of them a thank you message. Update your code to call sayThanks() three times.

Code: - 

 

function sayThanks(){

  console.log('Thank you for your purchase! We appreciate your business.');

}

sayThanks();

sayThanks();

sayThanks();

sayThanks();

Output :-Thank you for your purchase! We appreciate your business.

Thank you for your purchase! We appreciate your business.

Thank you for your purchase! We appreciate your business.

Parameters and Arguments

When calling a function that has parameters, we specify the values in the parentheses that follow the function name. The values that are passed to the function when it is called are called arguments. Arguments can be passed to the function as values or variables.

Code of Function with argument

function sayThanks(name) {

  console.log('Thank you for your purchase '+ name + '! We appreciate your business.');

}

sayThanks('Cole');

Output :- Thank you for your purchase Cole! We appreciate your business.

Default Parameters

Default parameters allow parameters to have a predetermined value in case there is no argument passed into the function or if the argument is undefined when called.

code:-

function makeShoppingList(item1 = 'milk', item2 = 'bread', item3 = 'eggs'){

  console.log(`Remember to buy ${item1}`);

  console.log(`Remember to buy ${item2}`);

  console.log(`Remember to buy ${item3}`);

}

•  ‘milk’ as the default value of item1.
• ‘bread’ as the default value of item2.
•  ‘eggs’ as the default value of item3.

Return

Helper Functions

We can also use the return value of a function inside another function. These functions being called within another function are often referred to as helper functions.

Code

function monitorCount(rows, columns) {

  return rows * columns;

}

function costOfMonitors(rows, columns){

  return monitorCount(rows,columns)*200;

}

const totalCost = costOfMonitors(5,4);

console.log(totalCost);

Output 4000

Function Expressions

Arrow Functions

a shorter way to write functions by using the special “fat arrow” () => notation.

Arrow functions remove the need to type out the keyword function every time you need to create a function. Instead, you first include the parameters inside the ( ) and then add an arrow => that points to the function body surrounded in { } like this:

const rectangleArea = (width, height) => {

  let area = width * height;

  return area;

};

Concise Body Arrow Functions

1. Functions that take only a single parameter do not need that parameter to be enclosed in parentheses. However, if a function takes zero or multiple parameters, parentheses are required.

2. A function body composed of a single-line block does not need curly braces. Without the curly braces, whatever that line evaluates will be automatically returned. The contents of the block should immediately follow the arrow => and the return keyword can be removed. This is referred to as implicit return.

So, This can be converted to this consize code

const plantNeedsWater = (day) => {

  if (day === 'Wednesday') {

    return true;

  } else {

    return false;

  }

};

const plantNeedsWater = day => day === 'Wednesday' ?true:false;