Function in JavaScript with Examples

In this tutorial, you will learn about javascript function and function expression with detail from this below examples.

Javascript Function

The fundamental building block of code that performs real-world JavaScript applications is functions. They are one of the most essential concepts in the language. so let's study the functions over in this tutorial.

What is actually are functions?

In the most simple form a function is piece of code that we can reuse again and again in our code. It's a little bit like a variable. Remember a variable holds value but a function can hold one or more complete lines of code. Javascript is also has a huge number of inbuilt functions but we will learn user-defined functions only.


function name()
{
//piece of codes
}

A function is declared using the function keyword and then we define a function name and let's now just create a simple displayname() which is a function that will simply log something to the console.So I will call this displayname() and then we need parenthesis and we will see in the example and then we use the curly braces to create functions.all the code that is within this code block here so within this block of curly braces is called the function.


function displayname()
{
   console.log("my name is dailyaspirants");
}

Calling a Function

In the above code program, we have declared a function named displayname(). we need to call it by using the word displayname().

Now, just you call the above displayname() function

//call function

displayname();

Then will get executed the code, it will executed in inspect on the browser or shortcut key F12 -> on console tab it will display the output. so In this case,

what should we expect here?

Let's see and indeed we get this my website name is dailyaspirant.com console.log("my website name is dailyaspirant.com"); because we call the function one time and so this line of code here was executed one time. If you call the function more than many times means you have to put the function log.

So, we just wrote our code on console.log() in javascript but it's not showing on the main website browser why? let's now take it to the next level and really use some more functionalities of functions because they can do a lot more than simply reusing a line of code like we did here. because we are not call the function on HTML code. How we call the function on HTML code. So Let's see and create an input button on HTML code onclick to the javascript function call. and the data return on the browser. On the previous, we call the function one by one but here once the button is created then click that button more time the result is one the value returns many times on console.log () in the inspect.

  
  <html>
<head>
<script type = "text/javascript" src="script.js"></script>
</head>
<body>
<input type="button" onclick="displayname()" value="show"></input>
</body>
</html>

  
  function displayname(){
console.log('dailyaspirants');
}

function displayname()
{
document.write("my webstie name is dailyaspirants.com");
}

The above piece of code is returned the single value of button click. The result is my website name is dailyaspirants.com

Function Parameters

A function is declared a parameter. parameters are used to passed the value when declaring a function.

  
  <html>
<head>
<script type = "text/javascript" src="script.js"></script>
</head>
<body>
<input type="button" onclick="displayname('dailyaspirants')" value="show"></input>
</body>
</html>

  
  function displayname(name)
{
document.write(	'my website name is '  +name+ ' .com.');
}

Function Return

The return statement is used to return the value from the function call. Nothing is return means the value is undefined value show in console.log().

  
  <html>
<head>
<script type = "text/javascript" src="script.js"></script>
</head>
<body>
<input type="button" onclick="showresult()" value="show"></input>
</body>
</html>


function shoesbal(addidas,woodland){
  
    const shoes = 'shoes balance in the store is addidas' +addidas+ 'and woodland' +woodland+'.';
	return shoes;
}
function showresult(){

	const result= shoesbal(255,105);
	document.write('result:'+result+'.');
	
}

I hope in the above program you will learn something and So do that now and only once you fully understand with this tutorial Thank you.

Dailyaspirants

Search This Blog