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