DEV Community: Pranay Rebeyro

Array Iterations in JavaScript

Pranay Rebeyro — Mon, 20 Jul 2026 15:11:55 +0000

forEach()
The forEach() method executes a function once for each element in an array.

It is mainly used when you want to perform an action, such as printing values, updating the UI, or making API calls.

array.forEach(function(element, index, array) {
    // code
});
element → Current array element
index → Position of the current element
array → Original array

Example 1: Print All Elements

let fruits = ["Apple", "Mango", "Orange"];

fruits.forEach(function(fruit) {
    console.log(fruit);
}); // Output:
Apple
Mango
Orange

Example 2: Using Index

let fruits = ["Apple", "Mango", "Orange"];

fruits.forEach(function(fruit, index) {
    console.log(index + " : " + fruit);
}); // Output:
0 : Apple
1 : Mango
2 : Orange

forEach() does not return a new array.

let numbers = [1, 2, 3];

let result = numbers.forEach(num => num * 2);

console.log(result); // Output: undefined

map()
The map() method creates a new array by applying a function to every element of the original array.

It is mainly used when you want to modify or transform array elements.

array.map(function(element, index, array) {
    return newValue;
});
element → Current array element
index → Position of the current element
array → Original array

Example 1: Double Every Number

let numbers = [1, 2, 3, 4];

let doubled = numbers.map(functio
n(num) {
    return num * 2;
});

console.log(doubled); // Output:
[2, 4, 6, 8]

Original Array vs New Array

let numbers = [1, 2, 3];

let doubled = numbers.map(num => num * 2);

console.log(numbers);
console.log(doubled); // Output:
[1, 2, 3]
[2, 4, 6]

Notice that map() does not change the original array. Instead, it returns a new array.

Array in JavaScript

Pranay Rebeyro — Wed, 15 Jul 2026 15:44:05 +0000

Array
An Array is a collection of multiple values stored in a single variable.

const fruits = ["Apple", "Mango", "Orange"];

Here, fruits contains three values.

Why Do We Need Arrays?
Without an array, you would write:

let fruit1 = "Apple";
let fruit2 = "Mango";
let fruit3 = "Orange";

Using an array:

const fruits = ["Apple", "Mango", "Orange"];

This makes the code shorter and easier to manage.

Array Index
Each value in an array has an index. The index always starts from 0.

Index:   0        1         2
        -------------------------
Array:  Apple   Mango   Orange

Accessing Array Elements
Use the index number to access a value.

const fruits = ["Apple", "Mango", "Orange"];

console.log(fruits[0]);
console.log(fruits[1]);
// Output:
Apple
Mango

Changing an Array Element
You can update any value using its index.

const fruits = ["Apple", "Mango", "Orange"];
fruits[1] = "Banana";
console.log(fruits);
// Output:
["Apple", "Banana", "Orange"]

Finding the Length of an Array
Use the "length" property.

const fruits = ["Apple", "Mango", "Orange"];
console.log(fruits.length);
// Output: 3

Adding Elements

push() – Add at the End

const fruits = ["Apple", "Mango"];
fruits.push("Orange");
console.log(fruits);
// Output: ["Apple", "Mango", "Orange"]

unshift() – Add at the Beginning

const fruits = ["Mango", "Orange"];
fruits.unshift("Apple");
console.log(fruits);
// Output: ["Apple", "Mango", "Orange"]

Removing Elements

pop() – Remove from the End

const fruits = ["Apple", "Mango", "Orange"];
fruits.pop();
console.log(fruits);
// Output: ["Apple", "Mango"]

shift() – Remove from the Beginning

const fruits = ["Apple", "Mango", "Orange"];
fruits.shift();
console.log(fruits);
// Output: ["Mango", "Orange"]

Common Array Methods

includes() - Checks whether an element exists.

const fruits = ["Apple", "Mango", "Orange"];
console.log(fruits.includes("Mango"));
// Output: true

indexOf() - Returns the index of an element.

const fruits = ["Apple", "Mango", "Orange"];
console.log(fruits.indexOf("Orange"));
// Output: 2

join() - Joins all elements into a single string.

const fruits = ["Apple", "Mango", "Orange"];
console.log(fruits.join(", "));
// Output: Apple, Mango, Orange

reverse() - Reverses the array.

let fruits = ["Apple", "Mango", "Orange"];
fruits.reverse();
console.log(fruits);
// Output: ["Orange", "Mango", "Apple"]

sort() - Sorts the array.

const fruits = ["Orange", "Apple", "Mango"];
fruits.sort();
console.log(fruits);
// Output: ["Apple", "Mango", "Orange"]

Array with Different Data Types
An array can store different types of values.

const data = ["Pranay", 21, true, 95.5];
console.log(data);

Nested Arrays
An array can also contain another array.

const numbers = [
    [1, 2],
    [3, 4]
];

console.log(numbers[1][0]);
// Output: 3

Constructor in JavaScript

Pranay Rebeyro — Wed, 15 Jul 2026 14:46:14 +0000

Constructor
Imagine you need to create 100 student objects.Writing each object separately would take a lot of time.Instead, we use a Constructor Function.A constructor acts like a blueprint for creating multiple objects.

Constructor Function
A constructor function starts with a capital letter by convention.It called automatically when object is created

function Student(name, age, course) {
    this.name = name;
    this.age = age;
    this.course = course;
}

Creating Objects Using a Constructor
Use the "new" keyword.

function Student(name, age, course) {
    this.name = name;
    this.age = age;
    this.course = course;
}

let student1 = new Student("Pranay", 21, "ECE");
let student2 = new Student("Rahul", 22, "CSE");

console.log(student1);
console.log(student2);
// Output:
Student { name: 'Pranay', age: 21, course: 'ECE' }
Student { name: 'Rahul', age: 22, course: 'CSE' }

Now we can create as many student objects as we want.

Adding Methods to a Constructor
A constructor can also create methods.

function Student(name, age) {
    this.name = name;
    this.age = age;

    this.greet = function () {
        console.log("Hello " + this.name);
    };
}

let student = new Student("Pranay", 21);

student.greet();
// Output: Hello Pranay

Why Use Constructors?
Without a constructor:

let student1 = {
    name: "Pranay",
    age: 21
};

let student2 = {
    name: "Rahul",
    age: 22
};

let student3 = {
    name: "Anu",
    age: 20
};

You keep writing the same code.

With a constructor:

function Student(name, age) {
    this.name = name;
    this.age = age;
}
let student1 = new Student("Pranay", 21);
let student2 = new Student("Rahul", 22);
let student3 = new Student("Anu", 20);

The code becomes shorter and easier to maintain.

Objects in JavaScript

Pranay Rebeyro — Wed, 15 Jul 2026 14:33:49 +0000

Object

An Object is a collection of key-value pairs. Each value is stored with a name called a key.It is collection of information in single variable.

Eg:
let student = {
    name: "Pranay",
    age: 21,
    course: "ECE"
};

Accessing Object Values

There are two ways to access object properties.

1. Dot Notation

console.log(student.name);
console.log(student.age); 
// Output: 
Pranay
21

2. Bracket Notation
Bracket notation is useful when the property name is stored in a variable.

console.log(student["course"]);
// Output: ECE

Adding a New Property
We can add new properties anytime.

let student = {
    name: "Pranay",
    age: 21,
    course: "ECE"
};
student.city = "Chennai";
console.log(student);

Updating a Property
We can change an existing value.

let student = {
    name: "Pranay",
    age: 21,
    course: "ECE"
};
student.age = 22;
console.log(student.age);

Deleting a Property
Use the "delete" keyword to delete the object.

let student = {
    name: "Pranay",
    age: 21,
    course: "ECE"
};
delete student.course;
console.log(student);

Core Components of Object
1. Properties: Variable Declaration
2. Methods: Function Declaration

let student = {
    name: "Pranay",

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

student.greet();
// Output: Hello!

This Keyword
Inside an object, this refers to the current object.

let student = {
    name: "Pranay",

    greet: function () {
        console.log("Hello " + this.name);
    }
};

student.greet();
// Output: Hello Pranay

Scope of Variables in JavaScript

Pranay Rebeyro — Sat, 11 Jul 2026 16:27:27 +0000

Scope
A variable is not always available everywhere in your program. Some variables can be used anywhere, while others can only be used inside a function or a block.This is called Scope.

Types of Scope in JavaScript

Global Scope - A variable declared outside any function or block is called a Global Variable.It can be accessed from anywhere in the program.

Eg:
let name = "Pranay";

function greet() {
    console.log(name);
}

console.log(name);

greet(); // Output:
Pranay
Pranay

Function Scope - Variables declared inside a function can only be used inside that function.

Eg:
function student() {
    let age = 20;

    console.log(age);
}

student(); // Output: 20

// If you try to access age outside the function
function student() {
    let age = 20;
}

console.log(age); // Output: ReferenceError: age is not defined

// This happens because age exists only inside the function.

Block Scope - A block is anything inside curly braces { }.Variables declared using let and const inside a block can only be accessed within that block.

Eg:
if (true) {
    let city = "Chennai";

    console.log(city);
} // Output: Chennai

// Trying to access it outside the block
if (true) {
    let city = "Chennai";
}

console.log(city); // Output: ReferenceError: city is not defined

var - Function-scoped and not block-scoped.
let and const - Block-scoped

Variable Hoisting
Hoisting means JavaScript processes declarations first, before running the program.

Hoisting - var and function
Non-Hoisting - let and const

Functions in JavaScript

Pranay Rebeyro — Sat, 11 Jul 2026 16:12:16 +0000

Function
Function is a reusable block of code designed to perform a specific task

Eg:
function greet() {
    console.log("Hello, World!");
}

greet(); // Output: Hello, World!

Function with Parameters
Sometimes we want to pass values to a function. These values are called parameters.

Eg:
function greet(name) {
    console.log("Hello " + name);
}

greet("Pranay"); // Output: Hello Pranay

Function with Multiple Parameters
A function can have more than one parameter.

Eg:
function add(a, b) {
    console.log(a + b);
}

add(10, 20); // Output: 30

Function with Return Value
Sometimes we don't want to print the result directly. Instead, we want the function to send the result back.For that, we use the return keyword.

Eg:
function add(a, b) {
    return a + b;
}

let result = add(10, 20);

console.log(result); // Output: 30

// The return statement ends the function and returns the value.

Function Expression
A function can also be stored inside a variable.

Eg:
const greet = function() {
    console.log("Hello JavaScript");
};

greet(); // Output: Hello JavaScript

Arrow Function
Arrow functions are a shorter way to write functions.

**Arrow Function**
Eg:
const greet = () => {
    console.log("Hello JavaScript");
};

greet(); //Output: Hello JavaScript

**Arrow Function with Parameters**
Eg:
const add = (a, b) => {
    return a + b;
};

console.log(add(10, 20)); // Output: 30

// If the function has only one line, we can write it even shorter.

Eg:
const add = (a, b) => a + b;

console.log(add(10, 20)); // Output: 30

Anonymous Function
A function without a name is called an Anonymous Function.

Eg:
const message = function() {
    console.log("Welcome");
};

message(); // Output: Welcome

// Here, the function has no name and is stored inside the variable message.

Loops in JavaScript

Pranay Rebeyro — Sat, 11 Jul 2026 15:55:46 +0000

Loop
A loop is used to execute a block of code repeatedly until a condition becomes false.

1. for loop - The for loop is the most commonly used loop. It is useful when you know how many times the loop should run.
2. while loop - The while loop executes as long as the condition is true.
3. do while loop - The do...while loop executes the code at least once, even if the condition is false.

**for loop**
for (let i = 1; i <= 5; i++) {
    console.log(i);
} // Output: 
1
2
3
4
5

**while loop**
let i = 0;
while (i < 10) {
  i++;
  if (i === 3) continue; // Skips printing 3
  if (i === 6) break;    // Stops the loop completely at 6
  console.log(i);
} // Output:
1
2
4
5
6

**do while loop**
let i = 1;

do {
    console.log(i);
    i++;
} while (i >= 5); // Output: 1

break - Stops the loop immediately.
continue - Skips the current iteration and moves to the next one.

Conditional Statements in JavaScript

Pranay Rebeyro — Sat, 11 Jul 2026 15:27:55 +0000

Conditional Statements
Conditional statements allow JavaScript to execute different blocks of code based on whether a condition is true or false.

if statement

if - The if statement executes a block of code only if the condition is true.

let age = 20;

if (age >= 18) {
    console.log("Eligible to vote");
} //Output: Eligible to vote

if else statement

if...else - Use if...else when you want one block of code to run if the condition is true and another block if it's false.

let age = 16;

if (age >= 18) {
    console.log("Eligible to vote");
} else {
    console.log("Not eligible to vote");
} // Output: Not eligible to vote

if elif statement

if...else if...else - Use this when you have multiple conditions to check.

let marks = 85;

if (marks >= 90) {
    console.log("Grade A");
} else if (marks >= 75) {
    console.log("Grade B");
} else if (marks >= 50) {
    console.log("Grade C");
} else {
    console.log("Fail");
} // Output: Grade B

switch statement

switch statement - The switch statement is used when you have many possible values for one variable.

let day = 3;

switch (day) {
    case 1:
        console.log("Monday");
        break;

    case 2:
        console.log("Tuesday");
        break;

    case 3:
        console.log("Wednesday");
        break;

    default:
        console.log("Invalid Day");
} // Output: Wednesday

// Important: The break statement stops the execution after the matching case.We must compulsory to use break statement because if you don't use break, JavaScript will continue executing the next cases even the output is correct.

Nested if statement

Nested if statement - You can also write an if statement inside another if.

let age = 20;
let hasLicense = true;

if (age >= 18) {
    if (hasLicense) {
        console.log("You can drive.");
    }
} // Output: You can drive.

Ternary Operator

Ternary Operator - A conditional expression used to choose between two values based on a condition.

The ternary operator (?:) is used to write simple conditions in a single line. It is commonly used instead of a simple if...else statement when assigning a value.

let isLoggedIn = true;
let systemMessage = isLoggedIn ? "Welcome back!" : "Please log in.";

console.log(systemMessage); // Outputs: Welcome back!

Variables and Operators in JavaScript

Pranay Rebeyro — Sat, 11 Jul 2026 15:09:37 +0000

Variables in JavaScript
variables are containers used to store data values that can be manipulated or referenced later in a program

let - A variable declared with let can be changed later.(Block-Scoped)
const - A variable declared with const cannot be reassigned(Block-Scoped).
var - var was the first way to declare variables in JavaScript. It was used before let and const were introduced.One thing to remember is that var can also be redeclared(Global-Scoped).

Operators
Operators are special symbols or keywords used to perform calculations, compare values, or manipulate data.

1.Arithmetic Operators
Used to perform standard mathematical equations.

Addition(+): Adds numbers or links strings together.
Subtraction(-): Finds the difference between numbers. Multiplication(): Multiplies numbers.
Division(/): Divides Numbers to find the quotient.
Modulo(%): Returns the leftover division remainder.
Exponentiation(*): Raises a number to a power.

2.Assignment Operators
Used to store or update values inside variables.

Assignment(=): Assigns a value to a variable.
Addition Assignment(+=): Adds a value to a variable and updates it.
Subtraction Assignment(-=): Subtracts a value and updates the variable.
Multiplication Assignment(*=): Multiplies a variable and updates it.
Division Assignment(/=): Divides a variable and updates it

3.Comparison Operators
These compare two values and always return a boolean true or false

Equality(==): Checks if values match, ignoring their data type.
Strict Equality(===): Checks if both the values and data types match.
Inequality(!=): Checks if values are not equal.
Strict Inequality(!==): Checks if values or types do not match. Greater Than(>): Returns true if the left value is bigger.
Less Than(<): Returns true if the left value is smaller.
Greater Than or Equal(>=): Checks if the left value is bigger or equal.
Less Than or Equal(<=): Checks if the left value is smaller or equal.

4.Logical Operators
Used to combine multiple conditions or reverse boolean values.

AND(&&): Returns true if both conditions are true.
OR(||): Returns true if at least one condition is true.
NOT(!): Reverses a boolean value (true to false)

5.Unary Operators
Operators that require only a single value to work.

Increment(++): Increases a numeric value by 1.
Two types of Increment PostIncrement(i++) and PreIncrement(--i)
Decrement(--): Decreases a numeric value by 1.
Two types of Decrement PostDecrement(i++) and PreDecrement(--i)

Important

In addition operator only concatenation will happen when merge two different data types and in other operators we will try to merge different data types it will show "NaN"(Not-a-Number)

Addition
Eg: 10+"5" = 105;
"Sam"+2 = Sam2

Subtraction
Eg: 10-"2" = 8
"Sam"-2 = NaN // Here you can see a difference that in subtraction when try to merge the difference data types the outputs becomes Nan.This is same for other operators expect the addition operator.

**Increment**
PostIncrement:
let i = 5;
let result = i++;
console.log(result); // Output: 5 
console.log(i); // Output: 6

PreIncrement:
let i = 5;
let result = ++i; 

console.log(result); // Output: 6
console.log(i); // Output: 6

**Decrement**
PostDecrement:
let i = 5;
let result = i--;
console.log(result); // Output: 5 
console.log(i); // Output: 4

PreDecrement:
let i = 5;
let result = --i; 

console.log(result); // Output: 4
console.log(i); // Output: 4

JavaScript

Pranay Rebeyro — Sat, 11 Jul 2026 14:28:44 +0000

JavaScript is a lightweight, interpreted programming language used primarily to make web pages interactive and dynamic.JavaScript first name was "MOCHA".

DATA TYPES
JavaScript data types are divided into two categories.

Primitive Type - String,Number,Boolean,BigInt,Undefined,Null,Symbol
Non-Primitive Type - Arrays,Objects,Functions

Word - String
Number - number
Large no - BigInt
true/false - boolean

How to Check a Data Type?
JavaScript provides the typeof operator.


eg: let age = 25;

console.log(typeof age);

output: number

Static Typing
Languages like Java use Static Typing.

eg: int age = 25; // Here we must add which datatype the value  blongs to.

Dynamic Typing
Languages like JavaScript, Python use Static Typing.

`eg: age = 25; // Here we need not to mention the data type.`