DEV Community: Nanthini Ammu

Callback Function and Array Iterations in JS

Nanthini Ammu — Fri, 17 Apr 2026 09:31:38 +0000

What is Callback function?

A callback function is a function that is passed as an argument to another function.
And is executed later.

function greet(name, callback) {
  console.log("Hello " + name);
  callback(); // calling the callback
}

function sayBye() {
  console.log("Bye!");
}

greet("Varun", sayBye);

Output :
Hello Varun
Bye!

Why Callback function ?

To handle asynchronous operations, ensuring code execution continues without blocking the program while waiting for a task—like API requests, file reading, or user input—to complete.

console.log("Hi");
setTimeout(()=> console.log("Hello"),2000);

forEach() :

It is an array method used to iterate through each element.
It executes a function once for every element.
Cannot use break or continue.
Does not return anything(undefined).

array.forEach(callback(element, index, array))

element : current index value.
index : current index.
array : original array.

const fruits = ["apple","orange","banana","papaya","pomegranate"];
fruits.forEach(function(a,b,c){
    document.write("Iteration :"+ b)
    document.write("<br>");
    document.write(" Value : "+a+" , ");
    document.write(" Index : "+b+" , ");
    document.write(" Array : "+c)
    document.write("<br>");
    document.write("<br>");
})

Output : 
Iteration :0
Value : apple , Index : 0 , Array : apple,orange,banana,papaya,pomegranate

Iteration :1
Value : orange , Index : 1 , Array : apple,orange,banana,papaya,pomegranate

Iteration :2
Value : banana , Index : 2 , Array : apple,orange,banana,papaya,pomegranate

Iteration :3
Value : papaya , Index : 3 , Array : apple,orange,banana,papaya,pomegranate

Iteration :4
Value : pomegranate , Index : 4 , Array : apple,orange,banana,papaya,pomegranate

//same program with arrow function as argument

const fruits = ["apple","orange","banana","papaya","pomegranate"];
fruits.forEach((a,b,c)=>{
    document.write("Iteration :"+ b)
    document.write("<br>");
    document.write(" Value : "+a+" , ");
    document.write(" Index : "+b+" , ");
    document.write(" Array : "+c)
    document.write("<br>");
    document.write("<br>");
})


//same program with function expression as argument

const fruits = ["apple","orange","banana","papaya","pomegranate"];
fruits.forEach(function(a,b,c){
    document.write("Iteration :"+ b)
    document.write("<br>");
    document.write(" Value : "+a+" , ");
    document.write(" Index : "+b+" , ");
    document.write(" Array : "+c)
    document.write("<br>");
    document.write("<br>");
})

const numbersarr = [1,3,5,8,9]
let value = 0;
numbersarr.forEach((a)=>value+=a);
document.write(value);

Output : 26

const numbersarr = [1,3,5,8,9]
let value = 0;
numbersarr.forEach((a)=>{
    if (a == 3)
    return //to skip this iteration
    value+=a
});
document.write(value);

Output : 23

map():

It is used to transform each element of an array. It returns a new array with modified values. It does not modify the original array; it creates a new one.

array.map(callback(element, index, array))

const numbersarr = [1,3,5,8,9]
let result = numbersarr.map(a=> a*5)
document.write(numbersarr);
document.write("<br>");
document.write(result);

Output : 
1,3,5,8,9
5,15,25,40,45

JS Arrays and array functions

Nanthini Ammu — Wed, 15 Apr 2026 05:26:44 +0000

What is an Array?

An array is a collection of multiple values stored in a single variable.
It is an Object type.
List of values known as element.
The first element is at index 0, the second at index 1, and so on.
Arrays can grow or shrink as elements are added or removed.
Arrays can store elements of different data types. So it is Heterogeneous.

Why use Array?

Instead of declaring dozens of separate variables for related items (like car1, car2, etc.), they can be grouped into one array.
Unlike in many other languages, JavaScript arrays are resizable and can hold a mix of different data types.
Arrays make it easy to loop through thousands of items to perform bulk operations.

Creating an Array:

const fruits = ["apple","orange","banan"]

//You can also create an empty array, and provide elements later:

const fruits = [];

fruits[0] = "Apple";
fruits[1] = "Orange";
fruits[2] = "Banana";

//The following example also creates an Array, and assigns values to it:

const fruits = new Array("Apple", "Orange", "Banana");

Accessing Array Elements:

document.write(fruits[0]);
document.write("<br>")
document.write(fruits[1]);

Loop through Array :

Normal :


const fruits = ["apple","orange","banan"]

for(let i =0; i<fruits.length; i++){
    document.write(fruits[i]);
    document.write("<br>");
}

Output:

apple
orange
banan

Using for of :


const fruits = ["apple","orange","banan"]

for(let a of fruits)
{
    document.write(a);
    document.write("<br>");
}

Using forEach :


const fruits = ["apple","orange","banan"]

fruits.forEach(a=> 
{
    document.write(a);
    document.write("<br>");

}
);

----------------------

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

let sum = 0;
numbers.forEach(a=> sum=sum+a);
document.write(sum);

Output : 15

Updating value:

const fruits = ["apple","orange","banan"]

document.write(fruits);
fruits[1] = "grapes";
document.write(fruits);


Output :

apple,orange,banan
apple,grapes,banan

Array Length:

const fruits = ["apple","orange","banan"]

document.write(fruits.length);

Output : 3

push() - add at end :

The push() method adds a new element to an array at the end.

const fruits = ["apple","orange","banan"]

document.write(fruits);
document.write("<br>");
fruits.push("papaya","guava");
document.write(fruits);

Output :
apple,orange,banan
apple,orange,banan,papaya,guava

unshift() - add at beginning:

The unshift() method adds a new element to an array at the beginning.

const fruits = ["apple","orange","banan"]

document.write(fruits);
document.write("<br>");
fruits.unshift("papaya","guava");
document.write(fruits);

Output :
apple,orange,banan
papaya,guava,apple,orange,banan

pop() - remove last:

The pop() method removes the last element from an array.

const fruits = ["apple","orange","banan"]

document.write(fruits);
document.write("<br>");
fruits.pop();
document.write(fruits);

Output :

apple,orange,banan
apple,orange

shift() - remove first:

The shift() method removes the first array element and shifts all other elements to a lower index.

const fruits = ["apple","orange","banan"]

document.write(fruits);
document.write("<br>");
fruits.shift();
document.write(fruits);

Output :
apple,orange,banan
orange,banan

toString() :

The toString() method returns the elements of an array as a comma separated string.

const fruits = ["apple","orange","banan"]

let fruitsList = fruits.toString();
document.write(fruitsList);

Output :
apple,orange,banan

at():

The at() method returns an indexed element from an array. The at() method returns the same as [].
Negative Index Counts backward from the end of the array. For example, -1 returns the last element, and -2 returns the second to last.

const fruits = ["apple","orange","banan"]

document.write(fruits[2]);
document.write("<br>");
document.write(fruits.at(2));

output:
banan
banan

join() :

The join() method also joins all array elements into a string.
It behaves just like toString(), but in addition you can specify the separator.

const fruits = ["apple","orange","banan"]

document.write(fruits.toString());
document.write("<br>");
document.write(fruits.join("*"));

Output:
apple,orange,banan
apple*orange*banan

delete :

The delete operator removes a property from an object.

const fruits = ["apple","orange","banan"]
document.write(fruits);
delete fruits[1];
document.write("<br>");
document.write(fruits[0]);
document.write("<br>");
document.write(fruits[1]);
document.write("<br>");
document.write(fruits[2]);

Output :

apple,orange,banan
apple
undefined
banan

concat() :

The concat() method creates a new array by merging (concatenating) existing arrays.
Does not modify original.
Can take multiple arrays/values.

const fruits = ["apple","orange","banana"];
const vegetables = ["onion","tomato","brinjal"];
const liquid = ["water","juice"] 
document.write(fruits.concat(vegetables,liquid));

Output :
apple,orange,banana,onion,tomato,brinjal,water,juice

copyWithin() :

The copyWithin() method in JavaScript is used to copy a sequence of array elements from one position to another within the same array.
It is a mutating method, meaning it modifies the original array in place without changing its length.

array.copyWithin(target, start, end)

default value of starting position, if not mentioned explicitly is 0.
default value of ending position, if not mentioned explicitly is array length.

document.write( fruits.copyWithin(2,0,3) );
document.write("<br>");
document.write(fruits);

document.write("<br>");

const vegetables = ["carrot","onion","tomato","brinjal","garlic"];

document.write( vegetables.copyWithin(2) );
document.write("<br>");
document.write(vegetables);

document.write("<br>");

const colors = ["red","orange","yellow","white","pink"]

document.write( colors.copyWithin(2,1) );
document.write("<br>");
document.write(colors);

document.write("<br>");

const shapes = ["circle","square","rectangle","triangle","diamond"]

document.write( shapes.copyWithin(-2,2) );
document.write("<br>");
document.write(shapes);


Output : 
apple,orange,apple,orange,banana
apple,orange,apple,orange,banana
carrot,onion,carrot,onion,tomato
carrot,onion,carrot,onion,tomato
red,orange,orange,yellow,white
red,orange,orange,yellow,white
circle,square,rectangle,rectangle,triangle
circle,square,rectangle,rectangle,triangle

flat() :

It is used to flatten nested arrays.
It converts a multi-level array into single-level array.
flat(depth) removes one level of nesting by default(depth =1).
Returns new array.Does NOT change original array.

const fruits = ["apple",["orange",["banana","papaya"]],"pomegranate"];

console.log(fruits.flat());
console.log(fruits.flat(1));
console.log(fruits.flat(2));
console.log(fruits.flat(3));
console.log(fruits.flat(Infinity));

Output :

slice() :

It is used to extract a portion of an array.
It returns a new array.It does NOT modify the original array.

array.slice(start, end)
start - starting index(included)
end - ending index(excluded)

const fruits = ["apple","orange","banana","papaya","pomegranate"];

const fruitsslice1 = fruits.slice(); //copy entire array
document.write(fruitsslice1); 
document.write("<br>"); 

const fruitsslice2 = fruits.slice(2);
document.write(fruitsslice2); 
document.write("<br>"); 


const fruitsslice3 = fruits.slice(2,3);
document.write(fruitsslice3); 
document.write("<br>"); 

const fruitsslice4 = fruits.slice(-4,-2);
document.write(fruitsslice4); 
document.write("<br>"); 

const fruitsslice5 = fruits.slice(-4);
document.write(fruitsslice5); 
document.write("<br>"); 

Output :

apple,orange,banana,papaya,pomegranate
banana,papaya,pomegranate
banana
orange,banana
orange,banana,papaya,pomegranate

splice() :

This function is used to modify the contents of an array by removing, replacing, or adding new elements.
It changes the original array.

array.splice(start, deleteCount, item1, item2, /* …, */ itemN)

start : index where operation begins
deleteCount : how many elements to remove
item1, item2 : elements to add(optional)

const fruits = ["apple","orange","banana","papaya","tomato"];
fruits.splice(2);
document.write(fruits); //removes element from index 2.

document.write("<br>");

const vegetables = ["carrot","onion","tomato","brinjal","garlic"];
vegetables.splice(3,2)
document.write(vegetables); //starting from 3rd index and removing 2 elements.

document.write("<br>");


const colors = ["red","orange","yellow","white","pink"]
colors.splice(1,2,"brown","black")
document.write(colors);  //replacing 2 elements(brown,black) against orange and yellow(from position 1). 

document.write("<br>");

const shapes = ["circle","square","rectangle"]
shapes.splice(2,0,"triangle","diamond")
document.write(shapes);  //not removing any element and adding triangle and diamond from index 2.

Output :
apple,orange
carrot,onion,tomato
red,brown,black,white,pink
circle,square,triangle,diamond,rectangle

toSpliced() :

Does not mutate the original array. Returns a new array containing all elements after the modification.
same logic as splice().

const fruits = ["apple","orange","banana","papaya","tomato"];
const fruitsSliced = fruits.toSpliced(2);
document.write(fruitsSliced); 

document.write("<br>");

const vegetables = ["carrot","onion","tomato","brinjal","garlic"];
const vegetablesSliced =  vegetables.toSpliced(3,2)
document.write(vegetablesSliced); 

document.write("<br>");


const colors = ["red","orange","yellow","white","pink"]
const colorsSliced =  colors.toSpliced(1,2,"brown","black")
document.write(colorsSliced);  

document.write("<br>");

const shapes = ["circle","square","rectangle"]
const shapesSliced =  shapes.toSpliced(2,0,"triangle","diamond")
document.write(shapesSliced);  


Output :
apple,orange
carrot,onion,tomato
red,brown,black,white,pink
circle,square,triangle,diamond,rectangle

Constructor Function

Nanthini Ammu — Wed, 15 Apr 2026 04:31:07 +0000

What is constructor function?

A constructor function is a function used to create multiple objects with the same structure.
It is like a blue print.
Function name starts with capital letter.

function Person(name,age)
{
    this.name = name;
    this.age = age;
        this.nationality = "Tamil";  //default value
    this.greet = function(){
    document.write(`Hi, I am ${this.name}`+"<br>");
    }
}


const varun = new Person("Varun", 6);
const Arun = new Person("Arun", 6);
varun.greet();
Arun.greet();
document.write(varun.nationality);

JS Object

Nanthini Ammu — Fri, 10 Apr 2026 04:37:35 +0000

What is Object?

An object is a collection of key-value(properties and values) pairs.
In other terms they are variables that can store both values and functions.
Functions are stored as key:function() pairs called methods.

const person = {
    name : "Varun", 
    age : 6, 
    isStudent : true
};

document.write(person.name+"<br>");
document.write(person.age+"<br>");
document.write(person.isStudent+"<br>");


Output : 
Varun
6
true

//Here name,age and isStudent are keys. Varun,6 and true are values.

Accessing object keys using Bracket Notation(useful for dynamic keys) :

const person = {
    name : "Varun", 
    age : 6, 
    isStudent : true
};

document.write(person["name"]+"<br>");
document.write(person["age"]+"<br>");
document.write(person["isStudent"]+"<br>");

Output :
Varun
6
true

Adding and Updating property :

const person = {
    name : "Varun", 
    age : 6, 
    isStudent : true
};

person.city = "chennai"; //adding new property
person.age = 7 //updating property

document.write(person.name+"<br>");
document.write(person.age+"<br>");
document.write(person.isStudent+"<br>");
document.write(person.city+"<br>");

Output : 
Varun
7
true
chennai

Deleting property :


const person = {
    name : "Varun", 
    age : 6, 
    isStudent : true
};

console.log(person.isStudent);
delete person.isStudent
console.log(person.isStudent); //undefined

Methods(Functions inside objects) :

const person = {
    name: "Varun",
    age:6,
    greet: function(){
        return "Hi, I am "+this.name+"."; //'this' refers to this object
    },
    play:()=>{
        return "I am Playing."
    }

};

document.write(person.greet()+"<br>");
document.write(person.play());

Output :
Hi, I am Varun.
I am Playing.

Nested objects :

A Nested Object is simply an object inside another object.

const person = {
    name: "Varun",
    age:6,
    address :{
        city: "Chennai",
        state: "Tamilnadu"
    }

};

document.write(person.address.city+"<br>");
document.write(person.address.state);

Output :
Chennai
Tamilnadu

JS Functions

Nanthini Ammu — Thu, 09 Apr 2026 07:28:43 +0000

Function :

Reusable blocks of code designed to perform specific tasks
Function run when it is called.

Example :


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

greet(); 

Output : Hello!

Variables(let) inside function are private.

function test() {
  let x = 10;
}

console.log(x); //error

Functions with Parameters :

Parameters allow to pass values to a function.
Parameters are listed inside the parentheses in the function definition.

Parameter : Variable in function definition
Argument : Actual value passed to function


function add(a,b) {   //  'a,b' is Parameter
  console.log(a+b);
}

add(5,6);      // "5,6" is Argument


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

greet("Varun");

Output : Hello Varun

Defautlt Parameter :

Default parameters allow to assign a default value to a function parameter.
If no argument is passed, default value is used.
Always keep default parameters at the end.

function display(name = "You"){

    console.log(name);
}

display("Varun");
display();

Output : 
Varun
You

Multiple Defautlt Parameters :

function add(a = 0, b = 0) {
  return a + b;
}

console.log(add(5, 3)); // 8
console.log(add(5));    // 5
console.log(add());     // 0

Return Values :

A function can return a value back to the code that called it.
When a function reaches a return statement, the function stops executing.The value after the return keyword is sent back to the caller.


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

let result = add(5, 3);
console.log(result); 

Outpu : 8

Function Types

Function Declaration.
Function Expression.
Arrow function.

Function Declaration :

The traditional way to define a named function. It is hoisted, meaning it can be called before its definition in the code.


let result = add(5, 3);
console.log(result); 

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

Function Expression :

A Function Expression is a function defined as part of an expression, rather than as a standalone function declaration. It is typically anonymous (no name), created at runtime (not hoisted), and most commonly assigned to a variable. Since it's not hoisted, it cannot be called before the line where it is defined.
After a function expression has been stored in a variable, the variable can be used as a function.
It is a function without a name. It ends with a semicolon.
This is not hoisted.As function expressions can not be called before they are defined.


const multiply = function(a, b) {
  return a * b;
};
console.log(multiply(4, 3));

Arrow Function :

It allows a simple syntax for function expressions.
Can create it without function, return keywords and curly brackets.
It can be used when the function body contains only one statement.
Parentheses are required for zero or multiple parameters.
It is not hoisted.


const multiply = (a,b)=> a*b;
console.log(multiply(1,2));

//Can also do this


const operator = (a,b) => {
    console.log(a+b); 
    console.log(a*b);
    console.log(a/b);
    console.log(a%b)
};
operator(1,2);

Excercise 2

Nanthini Ammu — Tue, 07 Apr 2026 08:10:06 +0000

21) Least Common Multiple

let number1 = 8
let number2 = 10

let minNumber = (number1<number2?number1:number2);
let maxNumber = (number1>number2?number1:number2);

while(true)
{

if(number2%minNumber == 0)
{
    document.write(parseInt(number2));
    break;
}

number2 = number2+maxNumber;

}

Output : 40

22) 2 power 5

let number = 2;
let power = 5;

document.write(number**5);

Output : 32

25) Fibonacci Series

let firstNumber = 0
let secondNumber = 1
let str = "";

str = firstNumber+","+secondNumber+","

for(let i =0; i<=10; i++)
{
    total = firstNumber+secondNumber; 
        str = str+total+","

    firstNumber = secondNumber; 
    secondNumber = total;
}
document.write(str.slice(0,-1));

26) Swapping two numbers

let firstNumber = 3;
let secondNumber = 5;
let temp = 0;

temp = firstNumber;
firstNumber = secondNumber;
secondNumber = temp

document.write("firstNumber : "+firstNumber+"<br>");
document.write("secondNumber: "+secondNumber);

27) Swapping without third variable

let firstNumber = 3;
let secondNumber = 5;

document.write("Before Swapping firstNumber : "+firstNumber+"<br>");
document.write("Before Swapping secondNumber : "+secondNumber+"<br>");

firstNumber = firstNumber+secondNumber; //8
secondNumber = firstNumber - secondNumber; // 3
firstNumber = firstNumber - secondNumber; //5

document.write("After Swapping firstNumber : "+firstNumber+"<br>");
document.write("After Swapping secondNumber : "+secondNumber+"<br>");

28) Fibonacci without using third variable

let firstNumber = 0;
let secondNumber = 1;

document.write(firstNumber+",");
document.write(secondNumber+",");

for(let i=0;i <=10; i++)
{

    firstNumber = firstNumber+secondNumber; //0+1 =1 
    document.write(firstNumber+","); //1 
    secondNumber = firstNumber+secondNumber;  // 1+1 = 2
    document.write(secondNumber+",");


}
Output : 0,1,1,2,3,5,8,13,21,34,55,89,144,233,377,610,987,1597,2584,4181,6765,10946,17711,28657,

30) First 10 Prime Numbers

let count = 1;
let str = "";

        for (let i = 2; i <= 100; i++) {
            let isPrime = true;

            for (let j = 2; j < i; j++) {
                if (i % j == 0)
                    isPrime = false
            }
            if (isPrime && count<=10){
                str = str+i+",";
                count++;
            }


        }

        document.write(str.slice(0,-1));

Output : 2,3,5,7,11,13,17,19,23,29

29) Odd Positions - Even Positions

let oddPositions = "";
let evenPositions = "";
for(let i = 1;i<=100;i++)
{
if(i%2 == 0)
evenPositions = evenPositions+i+",";
else
oddPositions = oddPositions+i+",";
}

document.write("Odd Positions : "+oddPositions.slice(0,-1)+"<br>");
document.write("Even Positions : "+evenPositions.slice(0,-1));

Output : 
Odd Positions : 1,3,5,7,9,11,13,15,17,19,21,23,25,27,29,31,33,35,37,39,41,43,45,47,49,51,53,55,57,59,61,63,65,67,69,71,73,75,77,79,81,83,85,87,89,91,93,95,97,99
Even Positions : 2,4,6,8,10,12,14,16,18,20,22,24,26,28,30,32,34,36,38,40,42,44,46,48,50,52,54,56,58,60,62,64,66,68,70,72,74,76,78,80,82,84,86,88,90,92,94,96,98,100

31) Sum of Digits until it becomes single digit

let number = 984567;
let total;
let temp =0;
while(number>10)
{
 total = 0;
while(number>0)
{

 total = total+ (number%10);
 number = parseInt(number/10);
}
    number = total;
}
    document.write(total)

Output : 3

32) Printing 5! 4! 3! 2! 1!

let printFactorial;
for(let i=5; i>=1; i--)
{
    printFactorial = 1;
for(let j = 1; j<=i; j++)
{

printFactorial = printFactorial*j;

}
document.write(`Factorial of ${i} :`+ printFactorial+"<br>");
}

Output : 
Factorial of 5 :120
Factorial of 4 :24
Factorial of 3 :6
Factorial of 2 :2
Factorial of 1 :1

32) Printing 5! 4! 3! 2! 1! using function recursion:

for(let i = 5; i>=1; i--)
{
    console.log(`factorial of ${i} :`+factorial(i));
}

function factorial(i)
{
    if(i==1)
        return 1;
    else
        return i*factorial(i-1);
}

Output :
factorial of 5 :120
factorial of 4 :24
factorial of 3 :6
factorial of 2 :2
factorial of 1 :1

33) Printing 110 29 38 47

let number = 10;

for(let i=1; i<=10; i++)
{

document.write(`${i} * ${number} : `+i*number+"<br>");
number--;

}

34) Printing 1 11 121

let number = 11;
for(let i=0; i<=5; i++)
{
document.write((number**i) + " ");

}

Output : 1 11 121 1331 14641 161051

35) Printing 1 8 27 64

let power = 3;
for(let i =1; i<=5; i++)
{
    document.write(i**power+" ");
}

Output : 1 8 27 64 125

36) Printing 1 4 9 16 25 36 49 64 81 100

for(let i =1; i<=10; i++)
{
    document.write(i*i+" ");
}

Printing 1 4 27 256

for(let i =1; i<=5; i++)
{
    document.write(i**i+" ");
}

38) Square Root of a Number

let number = 16
for(let i =2; i<=number; i++)
{
    if(number%i ==0 && number == i*i)
    {
    document.write(i);
    break;
    }
}
Output : 4

39) Spy Number

let number = 1124
let addition =0;
let multiplication = 1;
while(number>0)
{
addition = addition+(number%10);
multiplication = multiplication*(number%10);
number = parseInt(number/10);
}
if(addition ==multiplication )
document.write("Given number is a Spy number. Addition of digit is "+addition+ ".Multiplication of Digit is "+multiplication+".");
else
document.write("Given number is not a Spy number");

Output : Given number is a Spy number. Addition of digit is 8.Multiplication of Digit is 8.

40) Prime no.s in a fibonacci series

let firstNumber = 0
let secondNumber = 1
let str = "";
let primeNumber = "";
let isPrime;

str = firstNumber+","+secondNumber+","


for(let i =0; i<=10; i++)
{
    isPrime = true;
    total = firstNumber+secondNumber; 
    str = str+total+","

        for(let j =2; j<total; j++)
        {
        if(total%j ==0){
            isPrime = false;
            break;}
        }
        if(isPrime)
        primeNumber = primeNumber+total+" ";

    firstNumber = secondNumber; 
    secondNumber = total;
}

document.write("Fibonacci Series : ")
document.write(str.slice(0,-1));
document.write("<br>")
document.write("Primt Number in Fibonacci Series : ")
document.write(primeNumber);

Output : 

Fibonacci Series : 0,1,1,2,3,5,8,13,21,34,55,89,144
Primt Number in Fibonacci Series : 1 2 3 5 13 89

Looping Programs Excercise

Nanthini Ammu — Mon, 06 Apr 2026 06:34:18 +0000

1) 1 1 1 1 1

for(let i=1;i<=5;i++)
{
    document.write(1+" ");

}

Output :  1 1 1 1 1

2) 1 2 3 4 5

for(let i=1;i<=5;i++)
{
    document.write(i+" ");

}

Output : 1 2 3 4 5

3) 1 3 5 7 9

for(let i=1;i<=10;i+=2)
{
  document.write(i+" ");

}

Output : 1 3 5 7 9

4) 3 6 9 12 15

for(let i=3;i<=15;i+=3)
{
  document.write(i+" ");

}

Output : 3 6 9 12 15

5) Multiples of 3 and 5

let str = "";

for(let i=3;i<=100;i++)
{
    if(i%3 ==0 && i%5 ==0)
        str += i+", ";

}
document.write("Multiplies of 3 and 5 upto 100 : "+ str.slice(0,-2));

Output : 

Multiplies of 3 and 5 upto 100 : 15, 30, 45, 60, 75, 90

6) Multiples of 3 or 5

let str = "";

for(let i=3;i<=100;i++)
{
    if(i%3 ==0 || i%5 ==0)
        str += i+", ";

}
document.write("Multiplies of 3 or 5 upto 100 : "+ str.slice(0,-2));

Output : 

Multiplies of 3 or 5 upto 100 : 3, 5, 6, 9, 10, 12, 15, 18, 20, 21, 24, 25, 27, 30, 33, 35, 36, 39, 40, 42, 45, 48, 50, 51, 54, 55, 57, 60, 63, 65, 66, 69, 70, 72, 75, 78, 80, 81, 84, 85, 87, 90, 93, 95, 96, 99, 100

7) Divisors of given number

let number = 20;
let str = "1, ";

for(let i=2;i<number;i++)
{
    if(number%i==0)
    str+= i+", ";

}

str += number;
document.write(`Divisors of given number ${number} is : `+str);

8) Count of Divisors of given number

let number = 20;
let count = 2;

for(let i=2;i<number;i++)
{
    if(number%i==0)
       count++;

}

document.write(`Count of Divisors of given number ${number} is : `+count);

9) Prime Number - number greater than 1 whose only divisors are 1 and itself.

for(let i=2 ; i<100 ;i++)
{
    let isPrime = true;
    for(let j=2 ; j<i ; j++){

    if(i%j ==0)
        isPrime = false;
    }

    if (isPrime)
    document.write(i+" ");

}

Output : 2 3 5 7 11 13 17 19 23 29 31 37 41 43 47 53 59 61 67 71 73 79 83 89 97

10) Reverse Printing a number

let number = 23497;
let revisedNumber =0;
let remainder = 0; 

while(number>0)
{

    remainder = (number%10);
    revisedNumber = revisedNumber*10+remainder;
    number = parseInt(number/10);
}

 document.write(revisedNumber);

Output :  79432

11) Count of Digits

let number = 23497;
let count = 0;

while(number>0)
{
    number = parseInt(number/10);
    count++;
}

document.write(count);

Output : 5

12) Sum of Digits

let number = 23497;
let sumOfNumbers =0;
let remainder = 0; 

while(number>0)
{

    remainder = (number%10);
    sumOfNumbers +=remainder;
    number = parseInt(number/10);
}

 document.write(sumOfNumbers);

Output : 25

14) Palindrome -an integer that remains the same when its digits are reversed

let originalNumber = 101;
let number = originalNumber
let reverseNumber =0;
let remainder = 0; 

while(number>0)
{


    remainder = (number%10);
    reverseNumber = (reverseNumber*10)+remainder;
    number = parseInt(number/10);

}

if(originalNumber === reverseNumber)
    document.write(`${reverseNumber} is a palindrome number`);
else
    document.write(`${reverseNumber} is not a palindrome number`);

15) Armstrong Number -integer that equals the sum of its own digits, each raised to the power of the total number of digits

let originalNumber = 407;
let number2 = originalNumber;
let digitCount = findDigitCount(153);
let sumOfDigit = 0;

function findDigitCount(originalNumber)
{
    let number = originalNumber;
    let digit = 0;
    while(number>0)
    {
        number = parseInt(number/10);
        digit++;
    }

    return digit;
}


function findPowerOfDigit(value,digitCount)
{

    return value**digitCount;
}


while(number2>0)
{

    sumOfDigit = sumOfDigit+findPowerOfDigit(number2%10,digitCount);
    number2 = parseInt(number2/10);

}


if(sumOfDigit === originalNumber)
document.write(`Given number ${originalNumber} is an Armstrong Number`);
else
document.write(`Given number ${originalNumber} is not an Armstrong Number`);

16) Neon Number - the sum of digits of square of the number is equal to the number.

for(let i=0;i<=100;i++)
{
let sumOfDigit = 0;
let no = i**2;
while(no>0)
{
 sumOfDigit = sumOfDigit + (no%10);
 no = parseInt(no/10);

}
if (i == sumOfDigit)
document.write(`${i} is a Neon Number <br>`)
}

17) Strong Number - number whose sum of the factorial of its digits is equal to the original number.

Factorial of a Number : the product of all positive integers less than or equal to the number.

let origNumber = 145;
let number = origNumber;
let remainder = 0
let total = 0;


while(number>0)
{
 total = total+findFactorial(number%10);

 number = parseInt(number/10);
}

function findFactorial(remainder)
{
let factorialofNumber = 1;
    for(let i = remainder; i>=2;i--)
    {

    factorialofNumber =  factorialofNumber*i;
    }
    return factorialofNumber;

}
if(origNumber == total)
document.write(`Given number ${origNumber} is a Strong Number`);
else
document.write(`Given number ${origNumber} is not a Strong Number`);

18) Addition of first n numbers

let number = 15;
let total = 0;
for(let i=1; i<=number;i++)
{
total+= i;
}

document.write(total);

19) Factorial

let number = 6;
let factorialNumber = 1;
for(let i=1; i<=number;i++)
{
factorialNumber = factorialNumber*i;
}

document.write(factorialNumber);

20) Greatest Common Divisor

let number1 = 30;
let number2 = 15;
let GCD = 0;

for (let i = 2;i <= (number1<number2?number1:number2) ; i++)
{
if(number1%i ==0 && number2%i ==0)

GCD = i;
}

document.write(GCD);

if else scenarios 1

Nanthini Ammu — Fri, 03 Apr 2026 09:28:28 +0000

    //  1)Shopping Discount System
    // You have:
    // amount
    // isMember(boolean)  
    // A user buys products worth amount.
    // if amount ≥ 5000 => 20% discount
    // if amount ≥ 2000 => 10% discount
    // otherwise => no discount
    // members get extra 10% discount
    // Print final price after discount.

        let amount = 5000;
        let discount = 0;
        isMember = true;

        if(amount>=5000){
            discount=isMember ? 30 : 20;
        }else if(amount>=2000){
            discount=isMember ? 20 : 10;
        }else{
            discount= 0;
        }
        let finalAmount = amount - (amount * discount / 100);
        console.log(`Final amount to be paid: ${finalAmount} after applying a discount of ${discount}%`);

//  2)Login Access Check
//     you have:
//         username
//         password
//         isBlocked(boolean)
//     allow login only if:
//         username is "admin"
//         password is "1234"
//         user is not blocked
//     otherwise print appropriate message.

let username = "admin";
let password = "1234";
let isBlocked = false;

if(username==="admin" && password==="1234" && !isBlocked){
    console.log("Login successful");
}
else if(username==="admin" && password==="1234" && !isBlocked){
    console.log("User is blocked");
}
else if(username!=="admin"){
    console.log("Incorrect username");
}
else if(username==="admin" && password!=="1234"){
    console.log("Incorrect password");
}

// 3)Traffic Signal System
//     Signal color variable:
//         red = stop
//         yellow = get ready
//         green = go
//     print action based on color.

let signalColor = "Red";
if(signalColor.toLowerCase() === "Red".toLowerCase()){
    console.log("Stop");
}
else if(signalColor.toLowerCase() === "Yellow".toLowerCase()){
    console.log("Get ready");   
}
else if(signalColor.toLowerCase() === "Green".toLowerCase()){
    console.log("Go");
}    
else{
    console.log("Invalid signal color");   
 }

// 4)ATM Withdrawal
//     User has:
//         balance
//         withdrawAmount
//     Rules:
//         If withdrawAmount > balance = "Insufficient funds"
//         If withdrawAmount ≤ 0 = "Invalid amount"
//         Else => deduct and show remaining balance



let balance = 5000;
let Withdrawal = 2000;

if(Withdrawal>balance){
    console.log("Insufficient funds" )
}else if(Withdrawal<=0)
    console.log("Invalid amount")
else{
    console.log(`Amount after Withdrawal: ${balance-Withdrawal}`)
}

// 5)Mobile Data Usage
//     User has used data GB out of limit GB.
//     If usage ≥ 100% = "Limit exceeded"
//     If usage ≥ 80% => "Warning: nearing limit"
//     Else = "Usage normal"

    let dataUsed = 80; // in GB

    if (dataUsed >= 100) {
        console.log("Limit exceeded");
    } else if (dataUsed >= 80) {
        console.log("Warning: nearing limit");
    } else {
        console.log("Usage normal");
    }

        // 6)Electricity Bill
        //     Units consumed:
        //         0-100 => 5/unit
        //         101-300 => 7/unit
        //         300+  10/unit
        //     Calculate total bill.



        let unitsConsumed = 90;
        let unitPrice = 0;

        if (unitsConsumed > 0 && unitsConsumed <= 100) {
            unitPrice = 5;

        } else if (unitsConsumed >= 101 && unitsConsumed <= 300) {
            unitPrice = 7;

        } else if (unitsConsumed >= 301) {
            unitPrice = 10;
        }

        console.log(`Total Bill Value is ${unitsConsumed * unitPrice}`);

Truthy vs Falsy Values, Explicit Type Conversion

Nanthini Ammu — Fri, 03 Apr 2026 07:26:45 +0000

Truthy vs Falsy Values:

Falsy Values :

"",'' String with zero length
false- boolean keyword
0 number zero, -0 negative zero, 0n bigint zero.
NaN-Not a Number
null
undefined- Variable that has been declared but not assigned with a value.

Truthy Values :

Everything else Truthy.

function isFalsy(value) {
    if(value) {
        console.log ("The value is truthy.");
    } else {
        console.log ("The value is falsy.");
    }
}

isFalsy(false); //falsy value
isFalsy(0);     //falsy value
isFalsy(-0);    //falsy value
isFalsy(0n);    //falsy value
isFalsy(null);  //falsy value
isFalsy(undefined); //falsy value
isFalsy(NaN);    //falsy value
isFalsy("");    //falsy value
isFalsy('');    //falsy value
isFalsy(``);    //falsy value
isFalsy(1);     //truthy value
isFalsy(-1);    //truthy value
isFalsy(0.1);   //truthy value
isFalsy(-0.1);  //truthy value
isFalsy(1n);    //truthy value
isFalsy("false"); //truthy value
isFalsy("0");    //truthy value 
isFalsy("null"); //truthy value
isFalsy("undefined"); //truthy value
isFalsy("NaN");  //truthy value

Explicit Type Conversion :

It is used to manually convert a value from one data type to another using build-in functions.

Converting to String :

string(value)
.toString(value)

let a = 10;
console.log(typeof a); // number
console.log(typeof String(a)); // string
console.log(typeof a.toString()); // string

Converting to Number :

Number(value)
parseInt(value)
parseFloat(value)
Using unary +

let a ="10";
let b ="10.5";
console.log(typeof a); // string
console.log(typeof Number(a)); // number
console.log(typeof parseInt(a)); // number
console.log(typeof parseFloat(b)); // number


console.log(5+"10"); // string concatenation, result is "5" + "10" = "510"

// If one value is a string, + becomes string concatenation, not addition. Only + behaves differently , others (-, *, /) convert to numbers.

// Using unary + we can convert string to numeric.
console.log(5+ +"10"); // numeric addition, +"10" converts "10" to 10, result is 5 + 10 = 15


console.log(5-"10"); // numeric subtraction, "10" is converted to 10, result is 5 - 10 = -5
console.log(5*"10"); // numeric multiplication, "10" is converted to 10, result is 5 * 10 = 50
console.log(5/"10"); // numeric division, "10" is converted to 10, result is 5 / 10 = 0.5

Converting to Boolean :

Converts a value to true or false based on its truthiness
- Falsy values (become false): 0, "" (empty string), null, undefined, NaN, and false.
- Truthy values (become true): Everything else, including "0", "false", "null", "undefined", "NaN".

JS Operators

Nanthini Ammu — Thu, 02 Apr 2026 11:54:15 +0000

Arithmetic Operator:

Used for basic math operations.
- Addition +
- Subtraction -
- Multiplication *
- Division /
- Modulus (remainder) %
- Power **

let a = 20;
let b = 4;

// Addition (+)
let addition = a + b;
console.log("Addition (20 + 4):", addition);         // 24

// Subtraction (-)
let subtraction = a - b;
console.log("Subtraction (20 - 4):", subtraction);   // 16

// Multiplication (*)
let multiplication = a * b;
console.log("Multiplication (20 * 4):", multiplication); // 80

// Division (/)
let division = a / b;
console.log("Division (20 / 4):", division);         // 5

// Modulus / Remainder (%)
let modulus = a % b;
console.log("Modulus (20 % 4):", modulus);           // 0

// Exponentiation (**)
let exponentiation = a ** b;
console.log("Exponentiation (20 ** 4):", exponentiation); // 160000

Comparison Operators:

Used to compare value. Returns true or false.

let a = 10;
let b = 20;
let c = "10";

// Equal to (==)  - compares value only (type conversion allowed)
console.log("Equal to (10 == 20):", a == b);         // false
console.log("Equal to (10 == '10'):", a == c);       // true  (type coercion)

// Strict Equal to (===)  - compares value and type
console.log("Strict Equal (10 === 10):", a === 10);  // true
console.log("Strict Equal (10 === '10'):", a === c); // false (different types)

// Not Equal to (!=)  - compares value only
console.log("Not Equal (10 != 20):", a != b);        // true
console.log("Not Equal (10 != '10'):", a != c);      // false (type coercion)

// Strict Not Equal to (!==)  - compares value and type
console.log("Strict Not Equal (10 !== 20):", a !== b);  // true
console.log("Strict Not Equal (10 !== '10'):", a !== c); // true (different types)

// Greater than (>)
console.log("Greater Than (10 > 20):", a > b);       // false
console.log("Greater Than (20 > 10):", b > a);       // true

// Less than (<)
console.log("Less Than (10 < 20):", a < b);          // true
console.log("Less Than (20 < 10):", b < a);          // false

// Greater than or Equal to (>=)
console.log("Greater or Equal (10 >= 10):", a >= 10); // true
console.log("Greater or Equal (10 >= 20):", a >= b);  // false

// Less than or Equal to (<=)
console.log("Less or Equal (10 <= 20):", a <= b);    // true
console.log("Less or Equal (20 <= 10):", b <= a);    // false

Assignment Operators :

let a = 50;
console.log("Assignment (a = 50):", a);              // 50

// Addition Assignment (+=) a = a + 10
a += 10;
console.log("Addition Assignment (a += 10):", a);    // 60

// Subtraction Assignment (-=) a = a - 5
a -= 5;
console.log("Subtraction Assignment (a -= 5):", a);  // 55

// Multiplication Assignment (*=) a = a * 2
a *= 2;
console.log("Multiplication Assignment (a *= 2):", a); // 110

// Division Assignment (/=) a = a / 5
a /= 5;
console.log("Division Assignment (a /= 5):", a);     // 22

// Modulus Assignment (%=) a = a % 8
a %= 8;
console.log("Modulus Assignment (a %= 8):", a);      // 6

// Exponentiation Assignment (**=) a = a ** 3
a **= 3;
console.log("Exponentiation Assignment (a **= 3):", a); // 216

Logical Operator:

// Logical AND (&&) - returns true only if both operands are true
console.log("AND (true && true):", a && a);          // true
console.log("AND (true && false):", a && b);         // false
console.log("AND (false && false):", b && b);        // false

// Logical OR (||) - returns true if at least one operand is true
console.log("OR (true || false):", a || b);          // true
console.log("OR (false || false):", b || b);         // false
console.log("OR (true || true):", a || a);           // true

// Logical NOT (!) - reverses the boolean value
console.log("NOT (!true):", !a);                     // false
console.log("NOT (!false):", !b);                    // true

Type of Operator :

Returns the data type of a value as a string.

console.log("typeof 42:", typeof 42);                      // number
console.log("typeof 3.14:", typeof 3.14);                  // number
console.log("typeof 'hello':", typeof "hello");            // string
console.log("typeof true:", typeof true);                  // boolean
console.log("typeof undefined:", typeof undefined);        // undefined
console.log("typeof 9007199254740991n:", typeof 9007199254740991n); // bigint

Increment & Decrement :

//  Post-Increment (a++) 
// Uses the current value first, then increments by 1
let a = 5;
console.log("Initial a:", a);                        // 5
let postInc = a++;
console.log("postInc = a++ (value used):", postInc); // 5  (old value returned)
console.log("a after a++:", a);                      // 6  (incremented after)

// Pre-Increment (++a) 
// Increments first, then uses the new value
let b = 5;
console.log("Initial b:", b);                      // 5
let preInc = ++b;
console.log("preInc = ++b (value used):", preInc);   // 6  (incremented before returning)
console.log("b after ++b:", b);                      // 6

// Post-Decrement (a--) 
// Uses the current value first, then decrements by 1
let c = 10;
console.log("Initial c:", c);                      // 10
let postDec = c--;
console.log("postDec = c-- (value used):", postDec); // 10 (old value returned)
console.log("c after c--:", c);                      // 9  (decremented after)

//  Pre-Decrement (--a) 
// Decrements first, then uses the new value
let d = 10;
console.log("Initial d:", d);                      // 10
let preDec = --d;
console.log("preDec = --d (value used):", preDec);   // 9  (decremented before returning)
console.log("d after --d:", d);    //9

Java Script Variables and Data Types

Nanthini Ammu — Thu, 02 Apr 2026 09:33:01 +0000

Variables:

Variables are containers for storing data values.
Variables must be defined with unique names.
Variable name can contain Letters (a–z, A–Z), Digits (0–9), Underscore _, and Dollar sign $.
Variable name can't start with number.
Javascript is case sensitive.So let name and let Name both are different variables.
Don't use reserved keywords for variable names.
Use camelCase. Ex userName , totalAmount.
For contstant variables ise upper_case.Ex const MAX_LIMIT = 100;
For boolean use is or has. Ex isLoggedIn,hasPermission.

Data Types :

Primitive data types:

String : Text wrpped in quotes.
Number : Integers and Decimals.
BigInt : Used for integers larger than the safe limit of the Number type. Created by appending n to an integer
Boolean : Yes or No.
Undefined : Variable declared but value not yet assigned.
Null : empty.

Symbol :

Non Primitive data types:

Object, Array, Functions, Dates, RegExp.

How to declare variables:

JS has 3 keywords.
- var(old way – avoid),let(modern & recommended) and constconstant – cannot change.

Direct Assignment :
let city = "Chennai";

Declare first, assign later :

let country;
country = "India";

Reassign value :

let score = 10;
score = 20;

What is Scope?

Scope defines where a variable can be accessed in the code.
There are mainly 2 types. Function Scope(Function Level) and Block Scope(Block Level).

What is Block Level ?

A block is anything inside { } like if condition,loop, and function.
let and const follow block scope.

if (true) {
  let y = 20;
  console.log(y); // Works
}

console.log(y); // Error

What is Function Level?

A variable declared inside a function can be used only inside that function.
var follows function scope.

function test() {
  var x = 10;
  console.log(x); // Works
}

test();
console.log(x); //  Error (x is not accessible here)

var ignores block scope. if (true) { var a = 100; }

console.log(a); // Works.
Even though a is declared inside {}, it is accessible outside.

What is Hoisting?

Hoisting means JS moves declarations to the top of their scope before execution. So we can use a variable before we even declare it. Instead of an error, we get undefined.

Hoisting with var :

console.log(x); // undefined
var x = 10;

Why no error?
JavaScript internally treats it like this:

var x;
console.log(x); // undefined
x = 10;

Declaration is moved up
Value assignment stays in place

Hoisting with let and const :

console.log(y); // ReferenceError
let y = 20;

This happens because of Temporal Dead Zone (TDZ) - The time between
variable declaration and initialization.

Why var should not be used?

Lack of Block Scope. This can leak variables outside blocks.

if (true) {
  var x = 10;
}

console.log(x); // 10 (unexpected!)

Hoisting Issues. This hides bugs.

console.log(a); // undefined
var a = 5;

Can be redeclared. var allows us to redeclare the same variable name multiple times in the same scope without an error. This can lead to accidentally overwriting values. let and const will throw a SyntaxError if we try to redeclare them.

var name = "Arun";
var name = "Raj"; // no error

CSS Part 3

Nanthini Ammu — Fri, 27 Mar 2026 14:00:16 +0000

Display Property (block, inline, inline-block):

It controls how an element is shown on the page.

Block:

Element takes full width.
Starts on a new line.

<div>Block 1</div>
<div>Block 2</div>

div {
    display: block;
    background-color: lightblue;
}

Inline:

Elements stays in same line.
Takes only required width.

<span>Span 1</span>

span {
    display: block;  
    background-color: lightgreen;
}