JavaScript

JavaScript

In this article, I have written about JavaScript and its fundamentals.

·

5 min read

What is JavaScript -

JavaScript is a programming language. It is also known as a scripting language used primarily by web browsers to create a dynamic and interactive experience for the user. JavaScript allows users to interact with content in many imaginative ways. JavaScript can be used for client-side as well as server-side developments.

Why JavaScript was born -

  • To create interactive websites.

  • Client-side validation

  • Popup

  • Event on click

  • Many more

How to execute JavaScript -

To execute JS in a browser you can put it inside a script element inside an HTML document or you can put it inside an external JavaScript file with a .js extension and then reference that file inside the HTML document using an empty script element with the src attribute.

To execute JS is a runtime like Node.js, You can install it and run JavaScript code.

  • Open the terminal and type Node.js and the filename

You can run JavaScript code in a browser in the console.

  • Open the website and right click then select inspect and go to console and run js code.

Basics of Programming Language :

* Values

* Operations

* Variables

* Decisions

* Loops

* Functions

JavaScript Basics -

Data Types -

Primitive Data types :

Number - 5;

String - "Rafe Ahmad";
         'Rafe Ahmad';

Boolean - True;
          false;

Empty Values - Null;
               Undefined;

Non-Primitive Data types :

Array -

It is a collection of items. It means multiple items are store in one variable. Use [ ] square bracket to declare an array.

  • for example,

      [1, 2, 3, "Rafe", 8, "Virat"];
    

    Object -

    With the help of an object, You can store multiple collections of data.

    In JavaScript, "key: value" pairs are called properties. Use curly bracket to declare an object.

    For example,

      {
      first name: "Rafe",
      last name: "Ahmad"
      }
    

    Note :

    • Primitive data type has one single value.

    • Non-Primitive data type has more than one value.

Variable -

Placeholder for value:

Three ways to declare a variable in JavaScript :

var x = 5;
let y = 6;
const z = 8;
// When we don't have to change the value then use const.

Operator -

Assignment operator (=) :

It is used to assign a value to a variable.

Example,

let x = 5;

Arithmetic operator (+, -, *, /, %) :

It is used for a mathematical function that takes two operands and performs a calculation on them.

Example,

let x = 10;
let y = 10;
console.log(x + y)   // Output 20
console.log(x - y)   // Output 0
console.log(x * y)   // Output 100
console.log(x / y)   // Output 1
console.log(x % y)   // Output 0 (remainder)

Comparison Operator -

It is used in logical statements to determine equality or compare two values and return a boolean result, either true or false.

Example,

let x = 10;
let y = 15;
console.log(x > y)   //Output false
console.log(x < y)   //Output true
console.log(x >= y)   //Output false
console.log(x <= y)   //Output true

(==) or (===) :

(==) : Compare values, not datatypes.

let x = 5;
let y = 5;
console.log(x == y)   //true

let x = 5;
let y = "5";
console.log(x == y)   //true

(===) : Compare values and datatypes both.

let x = 5;
let y = 5;
console.log(x === y)   //true

let x = 5;
let y = "5";
console.log(x === y)   //false

Logical Operator -

Logical and (&&) : Check between two conditions and returns true if both values are true, it gives false if one of the values is false.

Logical or (||) : Check between two conditions and returns true if either of the two is true

Not (!) : Check between two conditions and returns false if the condition is true.

Condition -

If else -

It is used to execute the code whether a condition is true or false.

let age = 14;
if(age >= 18){
   cosnole.log("You can caste vote");
}else {
   console.log("You are not eligible")
}

// Output : You are not eligible

Switch case -

Switch is also used to execute the code whether a condition is true or false.

let age = 14;
switch (age){
    case age >=18:
     console.log("You can caste vote");
     break;
     default:
     console.log("You are not eligible")
}

Ternary Operator -

let age = 16;
let message;

age >= 18 ? (message = 'You can drive.') : (message = 'You cannot drive.');

console.log(message);

Loops -

The JS loops are used to iterate the piece of code. It makes the code compact. A loop will continue running until the defined condition returns false. Loops are used to repeat a block of code. For example, if you want to show a message multiple times, then you can use a loop. Loops are mostly used for array.

There are five types of loops in JavaScript -
  • while loop

  • do while

  • for loop

  • for in

  • for of

// while loop (a while loop is to execute a statement or code block repeatedly as long as an expression is true)
  let counter = 1;

  while(counter <= 10){
        document.write("while-loop");
        document.write('<br>');            /* (line break) */
        counter++;
  }

//   do while Loop (display text atleast one time)

  let counter = 11;

   do{
     document.write('do while loop');
     document.write('</br>');
     counter++;

    }while(counter <= 10);

// for Loop (........all conditions in one parantheses()..........)

  for(let counter = 1; counter <= 10; counter++){
        document.write('for loop');
    }

// for in
 let marks_10 = [90, 52, 60, 80, 75];
 for(let i in marks_10){
       console.log(marks_10[i]);
   }

// for of
 let marks_10 = [90, 52, 60, 80, 75];
 for(let i of marks_10){
       console.log(i);
   }

Function -

It is a set of statements that take inputs, do some specific computation, and produce output. To avoid repeating the same code again and again for different inputs, We can use a function to wrap that code and reuse it.

Syntax -

function functionName(Parameter1, Parameter2, ...)
{
    // Function body
}
functionName();

// Example
function addition(number1, number2)
{
    return number1 + number2;
}
addition(4, 5);

That's all about JavaScript, Thanks for reading!