7/30/2018

Functions in JavaScript Tutorials Updated 2018

Functions in JavaScript are same as any other programming languages. In this article, we are going to discuss functions in depth in javascript. Before you study javascript you need HTML and CSS the reason behind JavaScript is one of the three(HTML, CSS, Javascript) languages that every web designer or developers must learn.

What is a Function in Javascript:


A function is a block of code which can be reused anywhere in the program. The main benefit of a writing a function is that we didn’t need to write the same block of code again and again. Also, functions give us the modular approach of programming where we can break a large line of code program into small modules. Even JavaScript itself provide modular programming like we have many inbuilt functions which are written once in JavaScript and we can use them anywhere in the program. Being a web designer these 6 Facts You Should Know About Web Design.

Table of Content


  • What is a Function in Javascript
  • Javascript details image 
  • Defining a Function in Javascript
  • The syntax of Functions in Javascript
  • Example of a Function in Javascript
  • Explanations of Functions in Javascript
  • Parameters of a Function in Javascript
  • Calling of a Function in Javascript
  • Return Statement in Javascript


Suggestions: Before reading this article about functions in javascript, you have to know about Conditional Statements JavaScript(IF ELSE SWITCH). below is some example of predefined javascript functions.

For example: alert(), getElementbyId(), write() etc. Here we can write our functions too.

functions tutorials in javascript with diagram and list

Defining a Function in Javascript:


The most common way to define a function in JavaScript is to use function keyword before function name, parameter list can be empty or can contain a list of parameters and block of code of the function is written inside the curly braces.

Syntax of a Function in Javascript:


<script type="text/javascript">
        function function-name(parameters)
      {
         Block of code;
      }
  </script>

Example of a Function in Javascript:


<script type="text/javascript">
      function WelcometoPWB()
      {
         alert("Welcome to Programming With Basics");
      }
</script>

Calling of a Function in Javascript:


Calling means to invoke or using a function somewhere in the JavaScript code. A function is called simply by writing the name of that function if there are some parameters then pass those parameters.

Example:

<html>
   <head>
 
      <script type="text/javascript">
         function WelcomeToPWB()
         {
            alert ("Welcome To Programming With Basics!");
         }
      </script>     
   </head>
   <body>
      <p>Click Here </p>     
      <form>
         <input type="button" onclick="WelcomeToPWB()" value="Welcome To PWB">
      </form>       
   </body>
</html>

Parameters of Function in Javascript:


In the Early Examples we use functions without parameters, but as we said earlier we can pass parameters too to a function. These parameters are to be used inside the function and on the basis of the values of these parameters some manipulation inside a function can be done. A function can take more than one parameter separated by a comma.

Example:

<html>
   <head> 
      <script type="text/javascript">
         function sum(num1, num2)
         {
         var sum=num1+num2;
            document.write ("Sum is" + "  " + sum);
         }
      </script>     
   </head>
   <body>
      <form>
         <input type="button" onclick="sum(700, 7)" value="calculate Sum">
      </form>
   </body>
</html>

Return Statement:


JavaScript Function can also have a return statement, But this is optional. If you want a value to return after the function execution you can Write return statement at the end of the function like in the previous example you want to return the sum of two numbers a return statement can be used.

Example :

<html>
   <head>
      <script type="text/javascript">
         function sum(num1, num2)
         {
            var result
             result= num1 + num2
            return result
         }
       
         function NewFunction()
         {
            var total;
            total = sum(700,7);
            document.write("Sum Returned by the called function is" + "  " + total)
         }
      </script>     
   </head> 
   <body>     
      <form>
         <input type="button" onclick="NewFunction()" value="Click Here">
      </form> 
  </body>
</html>

Author:


This in-depth tutorial of Function in Javascript is written by Suman Yadav. Submit your article and be a member of our Programming With Basics | A Programming Solutions Blog Family. You can join us by sending a well-written article for more information visit Write for Us.

No comments:

Post a Comment