Javascript functions are defined using the function keyword. All the functions in javascript are objects or reference types, that can be assigned to a variable or passed as a parameter function.
Function Declaration
Functions can be declared in different ways
- Declaration way
function keyword followed by the function namefunction greeting(name) { return 'Hello '+name; } greeting('Messi'); Output: 'Hello Messi'
- Expression way
In the expression, way function doesn’t have a name and we assign the function to a variable. Functions that are declared without any name are called anonymous functions.var greeting = function (name) { return 'Hello '+name; } greeting('Messi'); Output: 'Hello Messi'
- Function constructor
Javascript provides a built-in function constructor called Function() through which a function can be defined.
var greeting = new Function ("name", "return 'Hello ' + name "); greeting('Messi');
Function Hoisting
In javascript, hoisting is a mechanism in which javascript engine will push the function declarations on to the top. Therefore we can invoke a function even before we declare and it works without any error.
Note: Function hoisting works only for declaration way and in expression way js throws an error.
Hoisting declaration way
Hoisting expression way
Function as parameter
A function can be passed as a parameter to another function. In below syntax, we are passing an anonymous function as a parameter to the Array sort function.
var bills = [40,50,10,60,70,30,50]; bills.sort(function(number1, number2){ return number1 - number2; }); Output: [10, 30, 40, 50, 50, 60, 70]
Function invocation
Function invoke is nothing but calling a function.
-
- Invoking function as a function
function greeting(name) { return 'Hello '+name; } greeting('Messi');
- Invoking function as a method.
var student = { name : 'vijay', location: 'Hyderabad', getDetails: function () { return this.name + this.location } }; student.getDetails(); output: "vijayHyderabad"
In the above syntax, this refers to the current object.
- Immediately-invoked functions
Immediately-invoked function expression (IIFE) also known as self-invoking anonymous functions. Generally, functions need explicit invoke or call but Immediately invoked function expression (IIFE) functions are executed right after defining the function.(function() { console.log('Hello world'); })(); output: 'Hello world';
These functions have their own scope and prevent global namespace pollution.
- Invoking function as a function
- call
A call allows us to specify this explicitly and invoke the function with the list of arguments. The calls were introduced in ECMAScript 3.
function add(c){ return console.log(this.a+this.b+c); } var obj = { a : 1, b : 2 } add.call(obj,3); Output: 6
- apply
apply method allows us to specify this explicitly and invoke the function with a single array of arguments. apply method was introduced in ECMAScript 3.
var arr = [1,2,3,5,67,8]; var max = Math.max.apply(null,arr); console.log(max); Output: 67
- bind came in ECMAScript 5. Bind method allows us to call a function with this set explicit. bind method returns a bounded function with the bound object.
this.x = 10; var moduleX = { x : 20, getX: function() { return this.x; } } var retriveX = moduleX.getX; retriveX(); var getBoundX = retriveX.bind(moduleX); getBoundX(); Output: 20
(adsbygoogle = window.adsbygoogle || []).push({});