DEV Community: Sivakumar Mathiyalagan

Promises - JavaScript

Sivakumar Mathiyalagan — Thu, 07 May 2026 18:34:34 +0000

what is promises in Javascript?

JavaScript is synchronous by default, which means code executes in a linear, line-by-line manner. Each statement waits for the previous statement to finish before executing.

However, some operations like:

API calls
Database queries
File reading
Timers (setTimeout)

take time to complete. If JavaScript waited for these operations synchronously, the entire program would pause and become slow or unresponsive.

To avoid blocking execution, JavaScript supports asynchronous programming.

A Promise is an object that represents the eventual completion or failure of an asynchronous operation. Promises allow JavaScript to continue executing other code while waiting for long-running tasks to finish.

Promises have three states:

Pending = operation is still running
Resolved = operation completed successfully
Rejected = operation failed

Why Promises?

Callback functions also help perform asynchronous operations in JavaScript.

A callback function is a function passed as an argument to another function and executed later, usually after an asynchronous task completes.

Before Promises were introduced, callbacks were commonly used for handling asynchronous tasks

However, when multiple asynchronous operations depend on each other, callbacks become deeply nested, leading to a problem called Callback Hell.

function analyse(callback) {
    setTimeout(() => {
        console.log("done analysis");
        callback();
    }, 2000);
}

function design(callback) {
    setTimeout(() => {
        console.log("done design");
        callback();
    }, 1000);
}

function develop(callback) {
    setTimeout(() => {
        console.log("done development");
        callback();
    }, 3000);
}

function test(callback) {
    setTimeout(() => {
        console.log("done testing");
        callback();
    }, 2000);
}

function deploy(callback) {
    setTimeout(() => {
        console.log("done deployment");
        callback();
    }, 1000);
}

to execute in order this is how callback functions are called and thus resulting in callback hell

analyse(() => {
    design(() => {
        develop(() => {
            test(() => {
                deploy(() => {
                    console.log("SDLC completed");
                });
            });
        });
    });
});

Problems with callback hell:

Code becomes difficult to read
Hard to maintain
Error handling becomes complicated
Debugging becomes difficult

To solve this issue, JavaScript introduced:

Promises
Async/Await (TBD)

let's see how to reslove the callback hell with promises

CODE:

function analyse() {
    return new Promise((res, rej) => {
        setTimeout(() => {
            console.log("done analysis");
            res();
        }, 2000);
    });
}
function design(){
    return new Promise ((res,rej)=>{
        setTimeout(()=> {
            console.log("done design")
            res();
        },1000);
    })

}

function develope(){
    return new Promise ((res,rej)=>{
        setTimeout(()=> {
            console.log("done development")
            res();
        },3000);
    })

}

function test(){
    return new Promise ((res,rej)=>{
        setTimeout(()=> {
            console.log("done testing")
            res();
        },2000);
    })
}

function deploy(){
    return new Promise ((res,rej)=>{
        setTimeout(()=> {
            console.log("done deployment")
            res();
        },1000);
    })
}

function sdlc(){
    analyse().then(()=>design())
    .then(()=>develope())
    .then(()=>test())
    .then(()=>deploy())
    .then(()=>console.log("SLDC Completed"))
}

sdlc();

OUTPUT:

Closures - Javascript

Sivakumar Mathiyalagan — Thu, 07 May 2026 06:14:07 +0000

Define Closure ?

A closure in JavaScript is the combination of a function bundled together with references to its surrounding state, known as the lexical environment. Essentially, a closure allows an inner function to "remember" and access variables from its outer (enclosing) scope even after the outer function has finished executing
Closures make it possible for a function to have "private" variables

a lexical environment is the internal structure that keeps track of:

Variables and function declarations available in the current scope
A reference to the outer (parent) environment
It’s the foundation of how scope and closures work

To Do List

Sivakumar Mathiyalagan — Tue, 05 May 2026 17:08:05 +0000

Code :

Output :

DOM EXERCISE - CALCULATOR

Sivakumar Mathiyalagan — Mon, 04 May 2026 16:55:29 +0000

CODE :

OUTPUT :

DOM Exercise

Sivakumar Mathiyalagan — Wed, 29 Apr 2026 04:48:48 +0000

EXE 1 : Light ON/OFF

OUTPUT:

EXE 2 : Character Count

OUTPUT:

DOM Interview Questions

Sivakumar Mathiyalagan — Tue, 28 Apr 2026 05:23:22 +0000

What is DOM?
DOM(Document Object Model)is a programming interface that represents a web page as a tree-like structure using DOM JavaScript make the html and css to behave dynamic
In this DOM each HTML element is an Object that can be accessed and manipulated

How to access an Element using DOM?
document.getElementById("myElement"); // Select by ID
document.getElementsByClassName("myClass"); // Select by Class
document.getElementsByTagName("p"); // Select by Tag Name
document.querySelector(".myClass"); // Select First Matching Element
document.querySelectorAll(".myClass"); // Select All Matching Elements

document is an object (the whole webpage is the document) Note: can be verified as when html file is created the default title is Document

An element in object can be accessed using DOT operator so (".") after document is used to call the methods inside of object document

listed methods like
getElementById("myElement");
getElementsByClassName("myClass");
getElementsByTagName("p");
querySelector(".myClass");
querySelectorAll(".myClass");
are some of the methods available in document to access the exact element in HTML

const element = document.getElementById("myElement");

element.innerText = "Welcome";

here myElement is itself an object that was stored in variable "element" so now the object name of the "myElement" is "element" by using this object name now the values inside can be modified

innerText is a key that is inside the object myElement(element) its value is now being modified

What is event in Javascript?
Events are actions that occur in the browser, such as clicks, key presses, or page loads. JavaScript can listen for these events and execute functions when they occur

How do you create and append a new element dynamically?
JavaScript allows you to create and append new elements dynamically using the Document Object Model (DOM) methods

document.createElement(): Creates a new element node of the specified type (e.g., div, p, button).(TBD)
element.textContent / innerHTML: Lets you add text or HTML content inside the newly created element.(TBD)
parent.appendChild() / parent.append(): Appends the new element to a parent node in the DOM, making it visible on the page.(TBD)

JavaScript Scenario Question-2

Sivakumar Mathiyalagan — Fri, 17 Apr 2026 16:03:22 +0000

Question 1:

Question 2:

Question 3:

Question 4:

Question 5:

Question 6:

Question 7:

Question 8:

Question 9:

Question 10:

Question 11:

Question 12:

Question 13:

Question 14:

Question 15:

Object & Array Scenario Questions

Sivakumar Mathiyalagan — Thu, 16 Apr 2026 15:31:25 +0000

User Profile Update

Shopping Cart Total

3.Find Specific Object

4.Add Item to Array

5.Count Items in Object

6.Convert Array to Object

Group Users by Role

git url https://gitlab.com/sivakumar_mathiyalagan/scenario-exercises.git

Array Iteration Methods

Sivakumar Mathiyalagan — Wed, 15 Apr 2026 15:23:48 +0000

forEach() :

1.This method accepts another function as an Argument(callback Function) to perform certain operation on the array it is iterating
2.To call any of the iteration method must check these criteria

must need an object to call the method
what argument need to be passed
what return type the iteration method provides

forEach method takes 3 arguments

The item value
The item index
The array itself

And forEach method returns nothing

output:

map()

Unlike forEach method map method retuns a new Array
It doesnot mutate the original Array
If some index value is not defined in an array for Example
[1,2, ,3,4]

output:

flatMap()

This method transforms each element into an array, then flattens it one level
map method returns single value make the resultant array as a nested array
whereas flatMap removes the nested format one level deep by default
let's see with example

in map method:

output:

Using flatMap method:

output:

filter()

This method creates a new array with the filtered value based on the condition provided through call back function

output:

reduce()

This method reduce the array to single value
this runs from left to right but it does not alter the original array

this methos takes 4 arguments

The total (the initial value / previously returned value)
The item value
The item index
The array itself

output:

SDLC [Software Development Life Cycle] and its Models

Sivakumar Mathiyalagan — Tue, 14 Apr 2026 06:42:02 +0000

WHAT IS SDLC ?
SDLC is a structured process from initial stage to deployment and maintanence of a software, It defines each stage of the software development typically 6 to 7 phase based on the development model

Planning
Analysis
Design
Coding
Testing
Deployment
Maintenance

PLANNING:

This stage determines whether the project is technically, financially, and operationally feasible
The planning phase often produces an initial software requirement specification (SRS) document. The SRS details the software’s functions, required resources, possible risks and project timeline

ANALYSIS:

During the analysis phase, the development team collects and analyzes information on the project’s requirements
At the end of the analysis phase, project managers and development teams fully understand the scope of the project, its functional and technical specifications and how to organize project tasks and workflows

DESIGN:

In this phase the requirement is converted to blueprint format to determine how the software flow is going to be. this involves High-Level Design (HLD) and Low-Level Design (LLD)
Design phase work is collected in a software design document (SDD), which is passed on to developers as a roadmap to use while coding
HLD - Defines system architecture, technology stack, database design, and major modules
LLD - Specifies component logic, APIs, data structures, and workflows

CODING:

In this phase developers starts to code based on the SRS and SDD which determines the coding language, integrate modules, server connection, API calls, UI are developed in this phase, often UNIT testing is also performed by developers at this stage

TESTING:

This phase comes after the development phase once the software becomes functional, based on the SRS the testing will be conducted and ensured if the developed software meet its expected result
Manual Testing and Automation Testing are performed during this phase

DEPLOYMENT:

In this phase the developed software is deployed into the server and made available for the users
Developers might deploy software in phases—such as a beta release, where a limited group of users tests an early version of the software—before releasing it to the public

MAINTANANCE:

Post-deployment support to ensures long-term usability
Bug fixes, performance tuning, updates, feature enhancements are the features of Maintanance phase

SDLC MODELS:

Waterfall Model
Agile Model
V-Model
Spiral Model
Incremental Model
RAD Model

WATERFALL MODEL:
It is a linear and sequential software development model
To forward or move to next stage previous stage must be completed
This provide structured and predictable process that works for well defined requirement
But this model is not very flexible as it does not allow backtracking and permits only minimal changes once a phase is completed

V-MODEL:
It is a method that includes testing and validation alongside each development phase. It creates a structure like the letter 'V'
This is also called as modified waterfall model and verification and validation model. In each phase of the SDLC has its own accompanying testing phase

AGILE:
The agile model runs on continuous improvement and development cycles—often called "sprints"-in which developers regularly make and release small, incremental changes
It is responsive to changing requests or requirements, enabling teams to more easily identify issues during the development process
It is more commonly used model in current SLDC

Software Testing

Sivakumar Mathiyalagan — Mon, 13 Apr 2026 07:46:23 +0000

WHAT IS SOFTWARE TESTING ?
It is a process of evaluating the software that is developed and ensuring that it meets the client requirement
It involves

Identifying bugs
fixing errors
Missed client Requirement

TYPES OF SOFTWARE TESTING ?

Manual Testing
Automation Testing

WHAT IS MANUAL TESTING ?

In Manual testing the test cases are executed by person and not by automation tools. Tester verify the test case scenarios and compare the test result with the expected result
It is a hands on approach to test a software and person involved in testing finds the bug and errors(user like approach)
Every new application must be manually tested before its testing can be automated
Unlike automated testing, manual testing relies on predefined test cases and can be time-consuming and prone to human error

WHAT IS AUTOMATION TESTING ?

In Automated testing user writes test cases in script format and executes those test cases using some automation tools. It allows to execute repetitive task without requiring manual support
It is more reliable than manual testing
compared to manual testing it is less time consuming and less human error
some popular automation tools are
Selenium
QTP(Quick Test Professional)
Sikuli
Appium
Jmeter

TYPES OF MANUAL TESTING ?

White Box Testing
Black Box Testing
Grey Box Testing

BLACK BOX TESTING:
Checks functionality without knowing internal code. It focuses only on inputs and expected outputs.

No knowledge of code required
Based on requirements and user perspective
Used for functional testing

WHITE BOX TESTING:
Involves testing with knowledge of internal code structure. It focuses on logic, conditions, and code paths.

Requires programming knowledge
Tests loops, conditions, and branches
Ensures code correctness and coverage

GREY BOX TESTING:
This is a combination of both white box and black box tesing, tester need to perform function test and also need to have coding knowledge to check the internal structure. if some test case fails tester will then make some changes in coding part

NOTE:

Smoke Testing
Sanity Testing
Regression Testing
Acceptance Testing are also some testing techniques available

WHAT IS FUNCTIONAL AND NON-FUNCTIONAL TESTING ?

FUNCTIONAL TESTING:

This type of testing checks the each functionality of the software with different test inputs and verify the output with the expected output
This testing is not concerned with the source code of the application
This testing focuses on checking the user interface, APIs, Database, Security, Client or Server Application, and functionality of the Application Under Test.

WHAT IS NON-FUNCTIONAL TESTING ?
This type of testing verify if the performance and behaviour of the software is as per requirement
Performance testing: checks how the software handles the numbers of user and sometimes overload to check its scalability and performance
Security testing: checks the various aspects of vulnerability and threats and checks if software is protected from those vulnerabilities
Load testing: This checks if multiple users are access the software at same time and how the software behaves in time to respond or to load data.

Server

Sivakumar Mathiyalagan — Sat, 11 Apr 2026 16:12:10 +0000

What is a server?

A server is a hardware device or software that process the request sent by the client through a network and replies or response to them
Client is a device that sends the request and wait for the response from the server
Multiple clients can be served by a single server, and a single client can use multiple servers.
These machines run on a client-server model, where clients request specific services or resources, and the server fulfills these requests.

client-server model is not the only model but most commonly used

Peer-to-Peer (P2P) Model
Distributed Systems
Microservices Architecture
Serverless Architecture
Hybrid Models are some of the other server models

What does a server do?

Data storage and retrieval
One of the primary function of server is to store and manage data
data of anytype like documents, media files most common response format is JSON(JavaScript Object Notation)

Website hosting
When you browse the internet, the web pages you access are typically hosted on web servers. These servers store the website’s files and deliver them to your web browser when you request a page.

Email services
Email servers manage the flow of electronic messages. They receive, store, and distribute emails to their intended recipients. Additionally, they handle tasks such as spam filtering and user authentication.

Application hosting
Many applications and software services are hosted on servers rather than running on individual devices. These servers provide the necessary computing power and resources to run applications

File sharing
Stores and lets users share files over a network, Authorization can be implemented to avoid breach of sensitive data.

Database Server
Provides database access and handles queries
following are some database servers

MySQL
PostgreSQL
Oracle Database
Microsoft SQL Server
MongoDB

Game Server
Hosts online multiplayer games and syncs game data between players

Why are servers important?

Without server internet might be of no use because server plays the major role in shaping how we communicate, access information, conduct business, and store data.
Every websites, mobile application, streaming platform, business Application or socail media utilize servers to host, store data, to store media files or even to authenticate users

Referred in geekforgeeks.org & serverwatch.com