Javascript Basics

Where do we need to place Javascript code in web page ?

Javascript code need to be written in <script></script> tag

<html>
    <head>
        <title>My Title</title>
    </head>
    <body>

        <script>
            // Javascript code will go here             
        </script>
    </body>
</html>

Javascript Comments

For single line comment in javascript code need to write // before the line of the code

<html>
    <head>
        <title>My Title</title>
    </head>
    <body>

        <script>
            // This line is commented
            // The below line will not run as it is commented
            // console.log("Hello")         
        </script>
    </body>
</html>

For multiline comment in javascript code need to write /* */

<html>
    <head>
        <title>My Title</title>
    </head>
    <body>

        <script>
            /* This line is commented
             The below line will not run as it is commented
             console.log("Hello")       
            */    
        </script>
    </body>
</html>

Javascript Statements

JavaScript statements are composed of:

Values, Operators, Expressions, Keywords, and Comments.

This statement tells the browser to write "Grow 90" inside an HTML element with id="demo":

document.getElementById("demo").innerHTML = "Grow 90";

Full code :

<html>
    <body>
        <a id="demo"></a>
        <script>
            document.getElementById("demo").innerHTML = "Grow 90";
        </script>
    </body>
</html>

Semicolons ;

Semicolons separate JavaScript statements.

Add a semicolon at the end of each executable statement:

var a, b, c;     // Declare 3 variables
a = 5;           // Assign the value 5 to a
b = 6;           // Assign the value 6 to b
c = a + b;       // Assign the sum of a and b to c

JavaScript White Space

JavaScript ignores multiple spaces. You can add white space to your script to make it more readable

The following lines are equivalent:

var person = "Hege";
var person="Hege";

A good practice is to put spaces around operators ( = + - * / ):

var x = y + z;

JavaScript Line Length and Line Breaks

For best readability, programmers often like to avoid code lines longer than 80 characters

If a JavaScript statement does not fit on one line, the best place to break it is after an operator:

document.getElementById("demo").innerHTML =
"Hello Dolly!";

JavaScript Code Blocks

JavaScript statements can be grouped together in code blocks, inside curly brackets {...}

The purpose of code blocks is to define statements to be executed together.

One place you will find statements grouped together in blocks, is in JavaScript functions

function myFunction() {
document.getElementById("demo1").innerHTML = "Hello Dolly!";
document.getElementById("demo2").innerHTML = "How are you?";
}

JavaScript Keywords

JavaScript statements often start with a keyword to identify the JavaScript action to be performed

Here is a list of some of the keywords

<b><u class="cdx-underline">Keyword</u></b>	<b><u class="cdx-underline">Description</u></b>
break	Terminates a switch or a loop
continue	Jumps out of a loop and starts at the top
debugger	Stops the execution of JavaScript, and calls (if available) the debugging function
do ... while	Executes a block of statements, and repeats the block, while a condition is true
for	Marks a block of statements to be executed, as long as a condition is true
function	Declares a function
if ... else	Marks a block of statements to be executed, depending on a condition
return	Exits a function
switch	Marks a block of statements to be executed, depending on different cases
try ... catch	Implements error handling to a block of statements
var	Declares a variable

JavaScript keywords are reserved words. Reserved words cannot be used as names for variables.