DEV Community: Praveen Kumar K

Array iteration methods in javascript

Praveen Kumar K — Wed, 15 Apr 2026 19:27:33 +0000

🔹 1. forEach()
Executes a function for each element in the array
Does not return a new array.

Program

let numbers = [1, 2, 3];

numbers.forEach(function(num) {
console.log(num * 2);
});

Output:

2
4
6

map() Creates a new array by transforming each element

JavaScript

let numbers = [1, 2, 3];

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

console.log(doubled);

👉 Output:

[2, 4, 6]

filter()

Returns a new array with elements that match a condition

JavaScript

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

let even = numbers.filter(function(num) {
return num % 2 === 0;
});

console.log(even);

Output:

[2, 4]

reduce()

Reduces array to a single value

JavaScript

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

let sum = numbers.reduce(function(total, num) {
return total + num;
}, 0);

console.log(sum);

Output:

find()

Returns the first element that satisfies condition

JavaScript

let numbers = [1, 3, 5, 8];

let result = numbers.find(function(num) {
return num > 4;
});

console.log(result);

Output:

some()

Returns true if any element satisfies condition

JavaScript

let numbers = [1, 2, 3];

let hasEven = numbers.some(function(num) {
return num % 2 === 0;
});

console.log(hasEven);

Output:

true

every()

Returns true if all elements satisfy condition

JavaScript

let numbers = [2, 4, 6];

let allEven = numbers.every(function(num) {
return num % 2 === 0;
});

console.log(allEven);

Output:

true

Why javascript is single thread?

Praveen Kumar K — Tue, 14 Apr 2026 17:55:43 +0000

JavaScript is a single-threaded language, meaning that it executes one operation at a time on a single thread. This characteristic is often misunderstood as a limitation, but JavaScript can still be non-blocking, which enables it to handle asynchronous operations like reading from a file, fetching data from an API, or waiting for user input without blocking the main thread.

Let's explore how JavaScript achieves this, and why it's an important feature for web development.

What Does Single-Threaded Mean?
A single-threaded language means that only one operation or task can be executed at any given time. This is different from multi-threaded languages, where multiple tasks can run at the same time in separate threads.

Single-Threaded Execution in JavaScript:

JavaScript is traditionally single-threaded because it operates in a single execution context — there is one call stack where functions are pushed and popped as they are executed. In JavaScript, the call stack operates on a LIFO (Last In, First Out) basis, where functions are executed in the order they are pushed onto the stack.

However, just because JavaScript is single-threaded doesn’t mean it’s inefficient or incapable of handling multiple tasks. The secret lies in JavaScript’s ability to handle asynchronous operations using non-blocking features.

How Does JavaScript Achieve Non-Blocking Behavior?

Even though JavaScript runs in a single thread, it can still perform tasks asynchronously without blocking the main thread. This is achieved through the use of the event loop, callback queues, and asynchronous APIs provided by the environment (like the browser or Node.js).

The Event Loop

The event loop is the mechanism that allows JavaScript to handle asynchronous operations while running in a single thread. It’s responsible for managing the execution of code, events, and messages in a non-blocking manner.

Here’s how it works:

Call Stack: JavaScript starts by pushing the execution context of functions onto the call stack, executing them one at a time.

Web APIs / Node APIs:

When JavaScript encounters asynchronous operations like setTimeout(), fetch(), or I/O operations in Node.js, it delegates these operations to the Web APIs (in the browser) or Node APIs (in Node.js).
Callback Queue: After the asynchronous operation is complete, the callback (the function that was passed as an argument) is added to the callback queue.

Event Loop:

The event loop constantly monitors the call stack and the callback queue. If the call stack is empty (i.e., all synchronous code has been executed), the event loop pushes the first callback from the queue onto the call stack for execution.

This process allows JavaScript to initiate tasks, move on to other tasks, and later return to handle the results of those tasks without blocking the execution of the main thread.

Now, let us understand with the help of the example:

console.log("Start");

setTimeout(() => {
console.log("This is asynchronous.");
}, 2000);

console.log("End");
Output

Start
End
This is asynchronous.

In this example:

The first console.log("Start") is executed and removed from the stack.

The setTimeout() function is encountered and placed in the call stack. It sets the callback function to await in the Web API (which handles the asynchronous operation), then the setTimeout() function is popped off the stack.

The third console.log("End") is pushed onto the stack and executed, and then it's popped off.

After 2 seconds, the callback function passed to setTimeout() is moved to the Callback Queue (or Event Queue), where it waits for the call stack to be empty.
The Event Loop checks if the call stack is empty. Once it is, the callback function is pushed to the call stack, executed, and printed as "This is asynchronous".

What are they primitive data types and non-primitive data types and difference?

Praveen Kumar K — Thu, 09 Apr 2026 18:49:19 +0000

Primitive and Non-primitive data-types in JavaScript.

Variables hold values, and every value has a specific data type that defines the kind of information it holds. These data types are broadly categorized into two groups: Primitive Data Types and Non-Primitive Data Types. Let us discuss it one by one.

Primitive Data Types:

Primitive data types are the built-in data types provided by JavaScript. They represent single values and are not mutable. JavaScript supports the following primitive data types:

1.1 Number:
Number data type in JavaScript can be used to hold decimal values as well as values without decimals.

Example:

let x = 250;
let y = 40.5;
console.log("Value of x=" + x);
console.log("Value of y=" + y);

Output
Value of x=250
Value of y=40.5

1.2 String:

The string data type in JavaScript represents a sequence of characters that are surrounded by single or double quotes.

Example:

let str = 'Hello All';
let str1 = "Welcome to my new house";
console.log("Value of str=" + str);
console.log("Value of str1=" + str1);

Output

Value of str=Hello All
Value of str1=Welcome to my new house

1.3 Undefined:

This means that a variable has been declared but has not been assigned a value, or it has been explicitly set to the value undefined.

Example:

let x;
console.log(x); // Outputs: undefined

Output:

Screenshot-(6)
undefined output

1.4 Boolean:
The boolean data type can accept only two values i.e. true and false.

Example:

let x;
console.log(x); // Outputs: undefined

Output:

Click to enlarge
boolean output

1.5 Null:

This data type can hold only one possible value that is null.

Example:

let x = null;
console.log("Value of x=" + x);

Output

Value of x=null

1.6 BigInt:

BigInt data type can represent numbers greater than 253-1 which helps to perform operations on large numbers. The number is specified by writing 'n' at the end of the value

Example: Below is an example.

let bigNum = 123422222222222222222222222222222222222n
console.log(bigNum)

Output

123422222222222222222222222222222222222n

1.7 Symbol:

Symbol data type is used to create objects which will always be unique. these objects can be created using Symbol constructor.

Example:

let sym = Symbol("Hello")
console.log(typeof(sym));
console.log(sym);

Output

symbol
Symbol(Hello)

Non-primitive Data Types:

Non-primitive data types, also known as reference types, are objects and derived data types. They can store collections of values or more complex entities. The two key non-primitive data types in JavaScript are:

2.1 Object:

An object in Javascript is an entity having properties and methods. Everything is an object in javascript.

How to create an object in javascript:

Using Constructor Function to define an object:

// Create an empty generic object
let obj = new Object();

// Create a user defined object

let mycar = new Car();
Using Literal notations to define an object:

// An empty object
let square = {};

// Here a and b are keys and
// 20 and 30 are values
let circle = {a: 20, b: 30};

Example:

// Creating object with the name person
let person = {
firstName: "MS",
lastName: "Praveen",
};

// Print the value of object on console
console.log(person.firstName
+ " " + person.lastName);

Output
MS Praveen

2.2 Array:

With the help of an array, we can store more than one element under a single name.

Ways to declare a single-dimensional array:

// Call it with no arguments
let a = new Array();

// Call it with single numeric argument
let b = new Array(10);

// Explicitly specify two or
// more array elements
let d = new Array(1, 2, 3, "Hello");

Example:

let a = new Array();
let b = new Array(10);
let d = new Array(1, 2, 3, "Hello");
console.log("value of a=" + a);
console.log("value of b" + b);
console.log("value of d=" + d);

Output

value of a=
value of b,,,,,,,,,
value of d=1,2,3,Hello

Note: JavaScript does not support two-dimensional arrays. but we can do this by creating an array of an array.

Primitive data types:

Primitive Data types are predefined.

Primitive Data types will have certain values.

Size depends on the type of data structure.

Examples are numbers and strings.

It can start with a lowercase.

Non-primitive data types:

Non-Primitive data types are created by the programmer
Primitive Data types will have certain values.

Non-Primitive data types can be NULL.

Size is not fixed.

Examples are Array and Linked List.

It can start with uppercase.

Reference website geeksforgeeks.org

Methods in JavaScript?

Praveen Kumar K — Wed, 08 Apr 2026 16:55:34 +0000

push() → Add element at end Adds a new element to the end of the array.[]

let fruits = ["apple", "banana"];
fruits.push("mango");

console.log(fruits);

👉 Output:

["apple", "banana", "mango"]

pop() → Remove last element Removes the last item from the array.

JavaScript

let fruits = ["apple", "banana", "mango"];
fruits.pop();

console.log(fruits);

👉 Output:

["apple", "banana"]

✔️ Use when removing the latest item

🔹 3. shift() → Remove first element

Removes the first element.

JavaScript

let fruits = ["apple", "banana", "mango"];
fruits.shift();

console.log(fruits);
// ["banana", "mango"]

👉 Use when removing from start

🔹 4. unshift() → Add at beginning

Adds element to the start of array.

JavaScript

let fruits = ["banana", "mango"];
fruits.unshift("apple");

console.log(fruits);
// ["apple", "banana", "mango"]

👉 Use when adding at start

🔹 5. length → Find array size
Gives total number of elements.

JavaScript

let fruits = ["apple", "banana", "mango"];
console.log(fruits.length);
// 3

👉 Useful for loops and counting

🔹 6. includes() → Check value exists

Checks if a value is present in array.

JavaScript

let fruits = ["apple", "banana", "mango"];
console.log(fruits.includes("banana"));
// true

👉 Returns true or false

🔹 7. indexOf() → Find position

Returns index (position) of element.

JavaScript

let fruits = ["apple", "banana", "mango"];
console.log(fruits.indexOf("mango"));
// 2

👉 If not found → returns -1

🔹 8. join() → Convert array to string

Joins all elements into a string.

JavaScript

let fruits = ["apple", "banana", "mango"];
console.log(fruits.join(", "));
// "apple, banana, mango"

👉 Useful for displaying data

🔹 9. slice() → Get part of array
Returns a portion of array (does not change original).

JavaScript

let fruits = ["apple", "banana", "mango"];
console.log(fruits.slice(0, 2));
// ["apple", "banana"]

👉 Start index included, end index excluded

🔹 10. splice() → Add/Remove elements

Changes the original array.

JavaScript

let fruits = ["apple", "banana", "mango"];
fruits.splice(1, 1);

console.log(fruits);
// ["apple", "mango"]

👉 Syntax:

JavaScript

array.splice(start, deleteCount, newItem)

What is constructor in JavaScript?

Praveen Kumar K — Tue, 07 Apr 2026 14:06:11 +0000

In JavaScript, a constructor is a special function used to create and initialize objects.
Simple idea

A constructor is like a blueprint for creating multiple similar objects.

Constructor function (old/classic way):

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

const p1 = new Person("Praveen", 25);
const p2 = new Person("Kumar", 30);

console.log(p1.name); // Praveen

Key points:

The function name usually starts with a capital letter.
The new keyword is used to call the constructor.
this refers to the new object being created.

Constructor in ES6 class (modern way):

class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}

const p1 = new Person("Praveen", 22);

Here:

constructor() is a special method inside a class.
It runs automatically when you create an object with new.

What happens when you use new?
When you do:

const p = new Person("Praveen", 22);

JavaScript:

Creates a new empty object
Sets this to that object
Runs the constructor function
Returns the object.

(TBD)

pop()
shift()
unshift()
forEach()
map()
filter()
reduce()
find()
findIndex()

What is object?

Praveen Kumar K — Mon, 06 Apr 2026 11:25:05 +0000

An object is a collection of data stored as key–value pairs.

✅ Example:

JavaScript:

let person = {
name: "Praveen",
age: 22,
city: "Chennai"
};

console.log(person.name); // Praveen

👉 Here:
name, age, city → keys
"Praveen", 22, "Chennai" → values

Object Inside Object (Nested Object):

Program:

Output:

What is Function and it's types?

Praveen Kumar K — Sun, 05 Apr 2026 18:11:04 +0000

A function is a block of code designed to perform a specific task. It runs only when it is called (invoked), and it helps make code reusable, clean, and easy to manage.

Program:

function greet(name) {
return "Hello " + name;
}

console.log(greet("Praveen"));

✔ Output:

Hello Praveen

Types of Functions (in JavaScript)

Function Declaration: A normal function defined using the function keyword.

Program:

function add(a, b) {
return a + b;
}
✔ Can be called before declaration.

Function Expression: Function stored in a variable.

const multiply = function(a, b) {
return a * b;
};
✔ Cannot be called before definition.

Arrow Function (ES6): Short and modern syntax. Program:

const subtract = (a, b) => a - b;
✔ Clean and simple
✔ No function keyword needed.

Anonymous Function: Function without a name.

Program:

setTimeout(function() {
console.log("Hello");
}, 1000);
✔ Mostly used as arguments.

IIFE (Immediately Invoked Function Expression) Runs immediately after creation.

Program:

(function() {
console.log("Executed immediately");
})();

Callback Function:

A function passed as an argument to another function.

Program:

function processUser(name, callback) {
callback(name);
}

processUser("Praveen", function(name) {
console.log("Hello " + name);
});

Recursive Function: A function that calls itself.

Program:

function factorial(n) {
if (n === 0) return 1;
return n * factorial(n - 1);
}

Define Function in Javascript?

Praveen Kumar K — Fri, 03 Apr 2026 18:12:28 +0000

Step 1:

What are Functions?
Functions are reusable code blocks designed for particular tasks.
Functions are executed when they are called or invoked
Functions are fundamental in all programming languages.

Step 2:

Calling Functions:

Functions are executed when they are called or invoked
You call a function by adding parentheses to its name: name().

Step 3:

Function Parameters:

Parameters allow you to send values to a function.
Parameters are listed in parentheses in the function definition.

Step 4:

Function Return Values:

A function can return a value back to the code that called it.
The return statement is used to return a value from a function.

Step 5:

Function Arguments:

Function parameters and arguments are distinct concepts.
Parameters are the names listed in the function definition.
Arguments are the values received by the function.

Step 6:

Function Expressions:

A function expression is a function stored in a variable
The variable name can be used to call the function.

Step 7:

Arrow Functions:

Arrow Functions is a short syntax for function expressions.
You can skip the function keyword.
You can skip the return keyword.
You can skip the curly brackets.

For Example:

![ ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wg76mxv3uy34yoy80yvy.jpg

Simple Program and Output:

Write a program to find the total marks, average and Grade using while loop.

Praveen Kumar K — Thu, 02 Apr 2026 15:21:18 +0000

PROGRAM:
const marks=[96,65,64,74,80];
let i=0;
let failCount=0;
let total=0;
let average=0;
let j=0;
while(i if(marks[i]<35){
fcount++;
}
i++
}
console.log("FailCount",failCount);
if(failCount>0){
console.log("no grade")
}
else{
j=0;
while(j total+=marks[j];
j++;
}
}
console.log("Total",total);
average=Math.floor(total/marks.length);
console.log("Average",average);
if(failCount==0){
if(average>=90){
console.log("grade A");
}
else if(average>=80){
console.log("grade B");
}
else if(average>=70 ){
console.log("grade C");
}
else if(average>=60){
console.log("grade D");
}
else{
console.log("grade E")
}
}
OUTPUT:
FailCount 0
Total 379
Average 75
grade B

Flowchart for Program:

Flowchart for looping:

Praveen Kumar K — Fri, 27 Mar 2026 09:09:47 +0000

What is JavaScript?

Praveen Kumar K — Thu, 26 Mar 2026 09:43:28 +0000

JavaScript (JS) is a high-level, interpreted programming language mainly used to make websites interactive and dynamic. It runs inside the browser and allows you to control webpage behavior like clicking buttons, showing messages, validating forms, etc.
It is one of the core technologies of the web along with:

•HTML → Structure
•CSS → Styling
•JavaScript → Behavior

Key Features of JavaScript
Client-side scripting (runs in browser)

•Dynamic typing (no need to declare data types)
•Event-driven (responds to user actions like clicks)
•Object-oriented (supports objects and classes)
•Asynchronous (handles tasks like API calls)

Simple JavaScript Code:

<!DOCTYPE html>

JavaScript Example

Hello World

Click Me

function changeText() { document.getElementById("demo").innerHTML = "Text Changed!"; }

Explanation:

•button → When clicked, it calls a function
•changeText() → JavaScript function
•document.getElementById() → Selects HTML element
•innerHTML → Changes the content