Javascript functions

A function is simply a set of statements that performs a task. It can be just displaying some data or processing a data input etc. 😧. Ok, let me simplify it.

Suppose your mother gave you 100 Rupees and asked you to buy half kilograms of carrot, you have 100 Rupees and you go to the vegetable market and buy half kilograms of carrot and give to your mother. So, here you performed the task of buying a vegetable when you were given instruction by your mother. Assume the same will be done by functions. Functions perform specific tasks when asked to. You are given 100 Rupees called argument in function to perform a task to buy.

INPUT-->PROCESSING-->OUTPUT

Instruction to buy carrot with money-->you go to market and buy-->Give carrot to your mother

Now you know that what function is, let us see the ways we can define function in Javascript similar to how your mother defined a function for you.

Function definitions

Function declarations/statements
Function expressions
Arrow functions

1. Function declaration

The function can be defined using keyword function followed by function name with parameters enclosed in parentheses (), followed by the body of function defined inside curly braces {} which defines the scope of the function

    function add(number1,number2){
        let sum = number1 + number2;
        console.log("sum of ",number1," and ",number2," = ",sum);
    }

    add(10,20) //calling a function, here values 10 and 20 are copied by value to number1 and number2 respectively

    function display(names){
        names[2] = "Lincoln" 
        console.log(names); // prints ["Gandhi","Nelson","Lincoln","Tagore"]
    }

    let originalNames = ["Gandhi","Nelson","Teresa","Tagore"]

display(originalNames) //here originalNames array is copied by reference to names parameter in function display. Hence originalNames and names point to same location, changing elements of either array modifies the other array too


console.log(originalNames)
["Gandhi","Nelson","Lincoln","Tagore"] //change happened to originalNames too.

Note: No restriction in Javascript to pass parameters while calling the function even if in the definition of function parameter is declared, if the parameter is not received when called, the undefined value is considered

    function Counter(value){
        console.log(value); //undefined printed
    }

    Counter();

2. Function expressions

Here we define an anonymous(without a function name) function and assign it to a variable.

Note: function name can be included in ES5 not in ES6

    var cube = function(number) {
        return number^3;
    }
    var numberCube = cube(10);
    console.log(numberCube) //1000

3. Arrow functions

It is an alternative to function expressions. Here function is omitted and it is defined using parameters inside parentheses() followed by arrow =>.

    var square = (number) => {
        return number * number;
    }

    console.log(square(7)); //49

Whenever single parameter is received, parentheses() can be omitted in the arrow function definition

    var square = number => {
        return number * number;
    }

    console.log(square(7)); //49

Hope you had a good time knowing about functions. Say hi on Twitter

Meghana S K's Blog