Learning JavaScript for Begineers

95
learning javascript basics kodementor

In this article, I will guide you through the basics of JavaScript. JavaScript is a widely used web-based programming language that powers the dynamic behavior on most websites. JavaScript is not only used for Frontend but are also used for Backend. This post will help your to learn JavaScript Basics. So, let’s get started.

Placing your JavaScript File

You can place your javascript code anywhere in your file i.e. inside your header or inside your body. When you place your code inside your header or on top of your body tag, your javascript file will be loaded first and then the body is loaded. As a result, after loading all your scripts file, your body content is loaded. Thus, you can place your code according to your need.





    This is javascript basic example
    


    

This is my body

Link JavaScript to external file

You can easily link to your javascript file using src.
Example:


Using Chrome Developer Tools for JavaScript

You can test your javascript using google chrome developer tools. On browser running your project, open Inspect or Ctrl + Shift + I, and go to Console tab. In your console tab, you can test your javascript code. Run the command to test:

    10 + 5

It will display a result ’15’;
Also, you can catch your DOM element.

    document.getElementById('btn')

JavaScript Syntax & Rules

JavaScript has its own syntax structure and rules. Some of the basic are listed below:
Javascript is case sensitive.
Each statement ends with semi-colon (;).
JavaScript is not sensitive with white spaces or line breaks.
Comments can be done with //single_line_code or /* code block */.
Javascript runs from top to buttom.

JavaScript Variables

Variables are used to store informations or values. Variables in Javascripts are defined with var and variable name. Keep in mind, variable name cannot start with number.
Example:

var myVariable;
//or
var myNextVariable = 100;

Mathematical Operators

JavaScript comes with 5 mathematical operation. These are assignment (=), Addition (+), Multiplication (*), Subtraction (-) and Division (/). Let’s see these working in our console.
Assignment Operator:It assigns a variable with some value.
Example:

var age = 30;

Subtraction Operator: It displays difference between operands.
Example:

30 - 20
//outputs: 10

Multiplication Operator: It multiply two operands.
Example:

30 * 20
//outputs: 600

Division Operator: It divides top number by bottom number.
Example:

30 / 15
//outputs: 2

Addition Operator: It is used to concatenate two strings.
Example:

"Hello" + " World"
//outputs: Hello World

"Hello" + 5
//Hello5

Math Operator Short hand

Adding:

Short-hand for adding is done by +=
Example:

var a = 10;
var a += 20;

alert(a); //output: 30

Substraction

Similarly, substraction can be done using same technique.
Example:

var a = 300;
var a -= 200;

alert(a); //output: 100

Multiplication

Example:

var a = 10;
var a *= 20;

alert(a); //output: 200

Division

Example:

var a = 10;
var a /= 5;

alert(a); //output: 2

Incrementing or decrementing a variable by 1 can be done by ++ or —
Example:
Example:

var a = 10;
var b = 10;
var a++;
var b--;

alert(a); //output: 11
alert(b); //output: 9

Logging in Console

You can write in the document by using document.write(). Also, you can write in the console using console.log()
Example:

console.log('I am logged');

Boolean in JavaScript

A JavaScript Boolean represents one of two values: true or false.
Defining boolean variable:

var status = true;
//OR
Boolean(10 > 9)        // returns true

1 COMMENT

LEAVE A REPLY

Please enter your comment!
Please enter your name here