Exploring the Benefits of JavaScript Functions

Exploring the Benefits of JavaScript Functions

·

4 min read

Javascript Functions

  • JavaScript functions are used to perform operations. We can call Javascript function many times to reuse the code.

Advantage of Javascript function

There are mainly two advantages of Javascript function are:-

  1. Code reusability: We call a function several times so it saves coding.

  2. Less coding: It makes our program compact. We don't need to write many lines of code each time to perform a common task.

JavaScript Function Syntax

The syntax of declaring a function is given below.

 function functionName([arg1, arg2, ...argN]){  
 //code to be executed  
}

Example of Javascript function:-

Let’s see a simple example of a function in JavaScript that does not has arguments.

<script>  
function msg(){  
alert("hello! this is message");  
}  
</script>  
<input type="button" onclick="msg()" value="call function"/>

JavaScript Function Arguments

  • We can call functions by passing arguments. Let’s see the example of a function that has one argument.
<script>  
function getcube(number){  
alert(number*number*number);  
}  
</script>  
<form>  
<input type="button" value="click" onclick="getcube(4)"/>  
</form>

Function with Return Value

  • We can call a function that returns a value and use it in our program. Let’s see the example of a function that returns the value
 <script>  
function getInfo(){  
return "hello javatpoint! How r u?";  
 }  
</script>  
<script>  
document.write(getInfo());  
</script>

JavaScript Function Object

  • In JavaScript, the purpose of the Function constructor is to create a new Function object. It executes the code globally. However, if we call the constructor directly, a function is created dynamically but in an unsecured way.

Syntax:-

 new Function ([arg1[, arg2[, ....argn]],] functionBody)

Parameter:-

  1. arg1, arg2, .... , argn - It represents the argument used by function.

  2. functionBody - It represents the function definition.

JavaScript Function Methods

Let's see function methods with description.

  1. apply()

  2. bind()

  3. call()

  4. toString()

JavaScript Function apply() method

  • The Javascript Function apply() method is used to call a function containing this value and an argument contains elements of an array. Unlike the call() method, it contains a single array of arguments.

Syntax:-

function.apply(thisArg, [array])

Parameter:-

thisArg - It is optional. This value is given for the call to a function.

array - It is optional. It is an array-like object.

Return Value:-

It returns the result of the calling function along provided this value and arguments.

Example:-

<script>  
var arr = [7, 5, 9, 1];  
var max = Math.max.apply(null, arr);  
document.writeln(max);  
</script>

Output:-

9

JavaScript Function bind() method

  • The Javascript Function Bind() method is used to create a new function. When a function is called, it has this keyword set to the provided value, with a given sequence of arguments.

Syntax:-

function.bind(thisArg [, arg1[, arg2[, ...]]]

Parameter:-

thisArg - The this value passed to the target function.

arg1,arg2,....,argn - It represents the arguments for the function.

Return Value:-

It returns the replica of the given function along provided this value and initial arguments.

Example:-

<script>  
var website = {  
  name: "MDN Docs",  
  getName: function() {  
    return this.name;  
  }  
}  
var unboundGetName = website.getName;  
var boundGetName = unboundGetName.bind(website);  
document.writeln(boundGetName());  
</script>

Output:-

MDN Docs

JavaScript Function call() method

  • The Javascript Function call() method used to call a function contains this value and an argument provided individually. Unlike apply() method, it accepts the argument list.

Syntax:-

function.call(thisArg, arg1,arg2,....,argn)

Parameter:-

thisArg - It is optional. This value is given for the call to function.

arg1,arg2,...,argn - It is optional. It represents the arguments for the function.

Return Value:-

It returns the result of the calling function along provided this value and arguments.

Example:-

<script>  
function Emp(id,name) {  
  this.id = id;   
  this.name = name;  
}  
function PermanentEmp(id,name) {  
 Emp.call(this,id,name);  
}  
document.writeln(new PermanentEmp(101,"syed riza").name);  
</script>

Output:-

syed riza

JavaScript Function toString() method

  • The Javascript Function toString() method returns a string. Here, string represents the source code of the function.

Syntax:-

function.toString()

Return Value:-

It returns a string.

Example:-

 <script>  
function add(a,b) {  
  return a + b;  
}  
document.writeln(add.toString());  
document.writeln(typeof add.toString());  
</script>

Output:-

"function add(a,b) { return a + b; }" "string"

HAPPY Learning!!!

Did you find this article valuable?

Support syed by becoming a sponsor. Any amount is appreciated!