blog

Home / DeveloperSection / Blogs / JavaScript Functions

JavaScript Functions

Mark Devid 1907 04-Jul-2016

A function is defined as a group of code which can be called anywhere. This eliminates the need of writing the same code again and again. Functions enable a programmer to divide a program into a number of small functions.

A function is a block of code which is used to perform a particular task.

A JavaScript function is executed when "something" calls it (invokes it).

Following is an example of JavaScript function:

Code Implementation:
<!DOCTYPE html>

<html>
<body>
<p id="example"></p>
<script>
function myFunction(x, y) {
    return x * y;
}
document.getElementById("example").innerHTML = myFunction(6, 5);
</script>
</body>
</html>
  // output will be 30.
 

JavaScript Function Syntax

The common way to define a function is by using the function keyword which is used to define JavaScript function, followed by a name, and a parentheses ().

The parentheses may include argument names separated by commas:

para1, para2, para3).

Function names can contain digits, letter, dollar signs, underscores.

The code which is to be executed, by the JavaScript function, is placed inside curly brackets: {}

function functionname(para1, para2, para3) {

    statement
}

Functionname is the name of the function.

Para1, para2, para3 are the parameter.

Statement is the code which is to be executed.

Function Return

A JavaScript function can have return statement which is required to return a value from a function. This statement is the last statement in a function. In other words, A return statement is used to stop the function execution.

For example, when two numbers is passed in a function and then the function return their multiplication value in your calling program. Following is an example of Function return:

Code Implemetation:

<html>

<body>
<p id="example "></p>
<script>
function myfirst (x, y) {
    return x * y;
}
document.getElementById("example").innerHTML = myfirst (6, 3);
</script>
</body>
</html>
// The output for the above code will be 18.
JavaScript Objects
In JavaScript objects has two things: object properties and object method. Following is an example of JavaScript objects:

Code Implementation:

<html>

<body>
<p id="example "></p>
<script>
function mymaths (x, y) {
    return x * y;
}
document.getElementById("example").innerHTML = myFunction(5, 3);
</script>
</body>
</html>
// The output for the above code will be 15.
Object property
Object properties can be any of the abstract data types, or any of the three primitive data types, such as another object. Object properties are variables that are used internally in the object's methods, but can also be used globally wherever we want in our program.
The syntax for adding a property to an object is −
Nameoftheobject.objectproperty=value;

 Following is an example of object property:

Code Implementation:

<html>
<body>
<p id="example "></p>
<script>
var student= {
    firstName: "lovely",
    lastName : "singh",
    id : ST123
};
document.getElementById("example").innerHTML =
student.firstName + " " + student.lastName;
</script>
</body>
</html>
  // The output for the above code will be lovely singh.

 Object method

Methods are the functions that let something to be done to it. The difference between a method and a function –a method is attached to an object and can be referenced by this keyword and functions are a standalone that let the object to do something.

Methods are useful in many ways like performing complex mathematical operations, displaying the contents of the object on the screen.

For example  Following is a an example which shows how to use the write() method of document object to write contents on the document which is displayed on the screen.

document.write(“This is my first function”)
Following is an example of object method:

Code Implementation:

<html>

<body>
<p id="example"></p>
<script>
var student = {
    firstName: "lovely",
    lastName : "singh",
    id : ST123,
    fullName : function() {
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("example").innerHTML = student.fullName();
</script>
</body>
</html>




Updated 16-Mar-2018

Leave Comment

Comments

Liked By