Statements are “instructions” to be “executed” by Web Browser.
JS Statement
This is a simple statement to write “Code Projects” inside Html element.
<!DOCTYPE html>
<html>
<body>
<h1>JS Statements</h1>
<p>JS statements are executed by browser.</p>
<p id="ex"></p>
<script>
document.getElementById("ex").innerHTML = "Code Projects";
</script>
</body>
</html>
Output :
JS Programs
JS programs contains many JavaScript statements and statements are executed in order as they are written, 1 by 1. Below a, b, c are the values and at last value of c is displayed :
<!DOCTYPE html>
<html>
<body>
<h1>JS Statements</h1>
<p id="ex"></p>
<script>
var a, b, c;
a = 10;
b = 20;
c = a + b;
document.getElementById("ex").innerHTML = c;
</script>
</body>
</html>
Output :
Semicolons
Js Statements are separated by Semicolons ( ; )
<!DOCTYPE html>
<html>
<body>
<h1>JS Statements</h1>
<p> JS Statements are Separated by semicolons </p>
<p id="ex"></p>
<script>
var a, b, c;
a = 10;
b = 20;
c = a + b;
document.getElementById("ex").innerHTML = c;
</script>
</body>
</html>
Output :
White Space
Multiple spaces are ignored by JS. To make your codes more readable you can add White Spaces which makes your statements clear to read and understand.
var a = b + c; var person = "Harry";
Line Breaks & Line Lengths
To read codes clearly its better to break the line when it doesn’t fit in a single line and the best part to break line is after an operator.
<!DOCTYPE html>
<html>
<body>
<h1>JS Statements</h1>
<p> Its better to break code line after an operator or a comma to read it clearly!! </p>
<p id="ex"></p>
<script>
document.getElementById("ex").innerHTML =
"Code Projects";
</script>
</body>
</html>
Output :
Code Blocks
Use of code blocks is to define statements to be executed together.
<!DOCTYPE html>
<html>
<body>
<h1>JS Statements</h1>
<p> Between { & } code blocks are written! </p>
<p id="ex"></p>
<p id="exx"></p>
<button type="button" onclick="myFunction()">Click Me</button>
<script>
function myFunction() {
document.getElementById("ex").innerHTML = "Code Projects";
document.getElementById("exx").innerHTML = "Projects, Tutorials & More . .";
}
</script>
</body>
</html>
Output :
