Latest posts

10/recent/ticker-posts

Statements in JavaScript | Instruction In JavaScript | JavaScript Statements

 Statements in JavaScript

Instruction or Statements in JavaScript

What is Statements in Programming ?

An computer program is a set or list of "instructions", that can be "executed" by computer.
In Programming Languages, these instruction called as statements.
A javascript program is aslo a list or set of instructions.

Example :

Suppose want to write a program that can be gives the addition of number 10 and 5.
Instruction for user,
1) Get the numbers from user.
2) Add Numbers
3) Show the result

Instruction for JavaScript Program,
  <center>
  <h2 id="add">Addition of 10 + 5 is : ?</h2>
  <br>
  <button onclick="AddNum()">Show Addition</button>

  <script>
    function AddNum()
    {
        let num1, num2, result; // Variable to store the Numbers.

        num1 = 10;  // Statement 1 : Get Number From User
        num2 = 5;
        result = num1 + num2; // Statement 2 : Add Numbers

        document.getElementById("add").innerHTML = "Addition of 10 + 5 is : "+result; // Statement 3 : Show Addtion
    }
  </script>
</center

JavaScript Statements :

JavaScript is composed by the,
Values, Expressions, Operators, Keywords, and Comments.

Suppose,
 document.getElementById("demo").innerHTML = "Learn JavaScript";
This is a JavaScript Statement, which tells the to write "Learn JavaScript" inside the HTML Element which has ID 'demo'.

Every Programming Language can executes the Statements one by one to do specific tasks.
High level JavaScript Programms contains many statements.
The statements are executed, in a sequence of one by one, in the same order as they are written.

These Statements of JavaScript Programs are Known as JavaScript code.

To seperate the Statements in Program we can uses semicolons ( ; ).

Semicolns ;

To seperate staements we can uses the semicolons at the end of the stamenet.
 let num1, num2, result; // here we have declared 3 variables
 num1 = 10;  // Assigned value 10 to num1
 num2 = 5;   // Assigned value 5 to num2
 result = num1 + num2; // Assigned sun of num1 and num2 to result


Here we have seperated the statements by using semicolons.

We can also able to write multiple statements in a single line, by seperating them by semicolons.
  let a = 10; let b = 5; let c = a + b; document.write("Addtion is : "+c);

White Spaces in Statements

White space is a character, which can seperates two or more characters.

JavaScript can ignores the use of whitespaces, so we can able to use the whitespaces to make the code readable.

Example :
  <script>
    var x,y,z;
    x=10;y=5;z=x+y;document.write("Addition is : "+z);
  </script>

Here we have created 3 variable which can returns the result of 10 + 5.
We have written all the statements in a single line, but cannot be used whitespaces in between variable and printing statement.
It cannot be properly readable. So to make it readable, we uses WhiteSpaces in between Variables, Elements.

Example :
  <script>
    var x, y, z;
    x = 10; y = 5; z = x + y; document.write("Addition is : "+z);
  </script>

See, after modification, it's looking better now !

It's a good practice to put spaces around operators ( +, - , * , / , = ).

  <h3 id="lineBreak">Learn JavaScript ! Break the line by cliking the following Button !</h3>
  <br>
  <button onclick="breakLine()">Break Line</button>

  <script>
    function breakLine()
    {
        document.getElementById("lineBreak").innerHTML =
        "Learn JavaScript !<br> Break the line by cliking the following Button !";
    }
  </script>

Line Breaking  and JavaScript Line Length :

In Programming languages, it's a best practice to avoiding the length of code line longer than 80 characters.
If any statement contains to much characters, then it's best way to break the line after an operator.

Example :
 document.getElementById("lineBreak").innerHTML =
 "Learn JavaScript !<br> Break the line by cliking the following Button !";


JavaScript Code Blocks

  {
    // Statements
  }

A JavaScript code block is a sequence of opening and closing curly brackets {....}.
It can contains statements grouped togheher, it can be seperates the purposes of different statements.

Example :
  </script>

  <button onclick="fun1()">Function 1</button> <button onclick="fun2()">Function 2</button>

  <script>
    function fun1()
    {
        window.alert("Function 1 is executed !")
    }
    function fun2()
    {
        window.alert("Function 2 is Executed !")
    }
  </script>


Here we have created two function, that each has own code block.
Frist function returns a alert box which shows "Function 1 is executed !" and Second function also returns a alert box which can shows "Function 2 is executed !".

Hope it will helps you to learn JavaScript More !

Thank You !




Also Visit


Post a Comment

0 Comments