JavaScript Basics : A Beginner's Guide

JavaScript Basics : A Beginner's Guide

The Language of the Web

JavaScript is known as the language of the web because it makes web pages interactive and dynamic. In this article we will see the key points about javascript → variables, data types, operators, and control flow (using if, else, and switch). By the end you will clearly understand how these things work together in javascript.

Variables

What are Variables ?

A variable is like a labelled box where you store data. In JavaScript, we use var, let, or const to create variables. For examples →

var city = "Patna";

let year = 2025;

const pi = 3.14;
  • var → var can be used anywhere in a function and can be updated but not recommended in modern code because it can create confusion with its scope.

  • let → let can be used inside a block (inside {}). You can change its value but you cannot redeclare it in the same block.

  • const → const is also used inside a block but you cannot change or redeclare it.

keywordScopeCan redeclare ?Can reassign ?Use
varFunction / GlobalYesYesbroad use (not recommended)
letBlockNoYesChange variables
constBlockNoNoFixed Values

Data Types

In javascript data types can be divided into primitive and non-primitive.

Primitive Data Type

Primitive data types hold a single and simple piece of data. They are →

1. String → Text inside quotes ( ““, ‘‘).

let firstName = "Aryan";

2. Number → Any numeric value (integer or decimal).

let age = 23;

3. Boolean → true or false.

let isLoggedIn = false;
let hasMembership = true;

4. Undefined → A variable with no assigned value.

let result;

5. Null → A value that is empty or nothing.

let score = null; // means no score yet

6. BigInt → very large integers beyond the number limit.

let veryBigNumber = 123456789012345678901234567890n;

7. Symbol → A unique and special identifier.

let uniqueID = Symbol("id");

Non - Primitive Data Types

Non-primitive data types are objects which can hold many kinds of data. For example →

1. Object → A collection of key - value pairs.

let user = {
    firstName = "Aryan";
    lastName = "Sinha";
    age = 23;
    isLoggedIn = false;
    hasMembership = true;
}

2. Array → A special type of object for storing an ordered list of values.

let colours = ["red", "green", "blue"];

3. Function → A block of code that can be called with parentheses ().

function greet() {
  console.log("Hello Aryan!");
}

JavaScript Operators

Operators help us work with and manipulate data. Here are some common ones →

1. Arithmetic Operators

+ (addition), - (subtraction), * (multiplication), / (division) and % (modulus)

let a = 10;
let b = 4;
console.log(a + b);  // 14
console.log(a - b);  // 6
console.log(a * b);  // 40
console.log(a / b);  // 2.5
console.log(a % b);  // 2 (remainder)

2. Assignment Operators

\=, +=, -=, *= and /=

let score1 = 100;
score1 += 50; // score1 = score1 + 50
conosle.log(score1); // 150

let score2 = 100;
score2 -= 50; // score2 = score2 - 50
conosle.log(score2); // 50

let score3 = 100;
score3 *= 10; // score3 = score3 * 10;
conosle.log(score3); // 1000

let score4 = 100;
score4 /= 50; // score4 = score4 / 50
conosle.log(score4); // 2

3. Comparison Operators

\==, === (also checks data type), !=, !==, <, >, <= and >=

let x = 5;
console.log(x == 5);   // true
console.log(x === "5"); // false (different types x is number and "5" is string)
console.log(x !== 5);  // false
console.log(x < 10);   // true

4. Logical Operators

&& (AND), || (OR) and ! (NOT)

let isOpen = true;
let isWeekend = false;
console.log(isOpen && isWeekend); // false (both must be true)
console.log(isOpen || isWeekend); // true (one can be true)
console.log(!isOpen);            // false (NOT true)

Control Flow

Control flow decides which code to run based on conditions.

1. if, else if, else

Use if to check if something is true if it isn’t true you can use else if or else. For example →

let budget = 60000;

if (budget >= 55000) {
  console.log("You can buy a PlayStation 5 (Disc version).");
} else if (budget >= 45000) {
  console.log("You can afford PlayStation 5 (Digital version).");
} else {
  console.log("You might want to save more first buddy.");
}

flow in plain text →

  budget = 60000  
    Check if budget >= 55000?
      If yes => "You can buy a PlayStation 5 (Disc version)."
      If no => Check if budget >= 45000?
        If yes => "You can afford PlayStation 5 (Digital version).."
        If no => "You might want to save more first buddy."

2. Switch

A switch is useful when you have multiple cases for the same variable. break stops the code from checking any other cases once a match is found.

let day = "Wednesday";

switch(day) {
  case "Monday":
    console.log("Start the week strong (i feel you man).");
    break;
  case "Wednesday":
    console.log("Midweek check in.");
    break;
  case "Friday":
    console.log("Weekend is here.");
    break;
  default:
    console.log("Just another day.");
    break;
}

Conclusion

We have covered →

→ Variables (var, let, const).

→ Primitive Data Types (string, number, boolean, undefined, null, bigint and Symbol).

→ Non-Primitive Data Types (objects, arrays and functions).

→ Operators (arithmetic, assignment, comparison and logical).

→ Control Flow (if, else, else if and switch).

Thanks for reading this far.