Click here to Skip to main content
13,665,344 members
Click here to Skip to main content
Add your own
alternative version

Tagged as

Stats

5K views
3 bookmarked
Posted 20 Dec 2017
Licenced CPOL

JavaScript Functions

, 20 Dec 2017
Rate this:
Please Sign up or sign in to vote.
Javascript Functions explained

JavaScript has evolved into a mainstream language over a decade. The amount of flexibility that JavaScript provides has made it into a powerful language.

In JavaScript, almost everytime a piece of code is written, it's usually written inside a function. Most of our code execution is a result of function invocation. To better understand the functions, we need to look at some of the features of the JavaScript Objects. Javascript Objects can:

  • be created with literals
  • be assigned to variables, arrays, and properties of other objects
  • be passed to the functions as arguments
  • have properties
  • be returned as value

Well, JavaScript function can do all that the Object can, with an addition of having the capability to be invoked. We can safely say that JavaScript Functions are objects, that can be:

  • created with literals:
    function myFunc() { };
  • assigned to variables, arrays, and properties of other objects:
    var myFunc = function() { };     //Function assigned to variable
    
    myArray.push(function() { });    //Function pushed into the array
    
    myObj.myFunc = function() { };   //Function assigned to object's property
  • passed as an argument to other function:
    function myFunc(someFunc) {
        someFunc();
    }
    myFunc(function() { });
  • have properties:
    var myFunc = function() { };
    myFunc.someProperty = "George";
  • returned as value:
    function myFunc(){
         return function() { };
    }

Defining JavaScript Functions

Functions in JavaScript can be defined in a number of ways.

Function Declaration and Function Expression

Two of the most common ways a function could be defined in JavaScript is via Function Declaration and Function Expression. Function Declaration takes the function keyword followed by the function's name along with the parenthesis for function parameters and opening and closing curly braces, like:

function myFunc() {
     return "Function Declaration";
}

On the other hand, Function Expression works like any expression written in JavaScript with just the function keyword along with function parameters and the function body, like:

var myFunc = function() { return "Function Expression"; };

Immediately Invoked Function Expressions

As the name suggests, functions defined as Immediate Functions are evaluated as soon the expression is written. The IIFE mimic the module development in JavaScript:

var sum = (function (param1, param2) { return param1 + param2;  })(2,3);

Arrow Functions

Arrow Functions are an ES6 addition of JavaScript. They can be seen as a simplification to the Function Expressions by adding syntactic sugar to it. Arrow Functions are defined with fat arrow sign =>, like: 

var var1 = name => "Hi " + name;   //Defines an arrow function
var var2 = var1("George");

In case there is no parameter for the function, an arrow function can be defined as:

var myFunc = () => alert('Arrow Function Invoked');

In the next article, I will try to explain the implicit parameters that the JavaScript Function has.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

muhammadjawwad
Pakistan Pakistan
No Biography provided

You may also be interested in...

Comments and Discussions

 
Praise5 out of 5 Pin
israrali31-Dec-17 9:02
memberisrarali31-Dec-17 9:02 
QuestionJava at its best. Pin
Member 1333007520-Dec-17 23:56
memberMember 1333007520-Dec-17 23:56 
AnswerRe: Java at its best. Pin
Suvendu Shekhar Giri21-Dec-17 20:22
mvpSuvendu Shekhar Giri21-Dec-17 20:22 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Cookies | Terms of Use | Mobile
Web01-2016 | 2.8.180810.1 | Last Updated 20 Dec 2017
Article Copyright 2017 by muhammadjawwad
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid