DEV Community: Imran Shaik

Explain Closure in detail ?

Imran Shaik — Mon, 23 Dec 2024 06:15:08 +0000

A Closure is a feature in JavaScript where a function "remembers" the variable from its lexical Scope(the scope in which it was created) even after the outer function has finished executing. This allows inner functions to access variables from their enclosing scope, even if the outer function is no longer active.

Example of Closure

function outerFunction(outerVariable){
  return function innerFunction(innerVariable){
     console.log(`outer variable : ${outerVariable}`);
     console.log(`inner variable : ${innerVariable}`);

};}

const closureFunction = outerFunction('outside');
closureFunction('inside');

What is generator function in JavaScript? and How does it work?

Imran Shaik — Sun, 22 Dec 2024 12:09:37 +0000

A generator function in JavaScript is special type of function that can be paused and resumed during its execution. It is defined using function* syntax and uses the yield keyword to produce values sequentially.

Key Characteristics of Generator function

Define with function* :

function* generatorFunction(){
  yield 1;
  yield 2;
  yield 3;
  yield 4; 
}

2.Returns an Iterator

when a generator function is called, it doesn't execute immediately. Instead, it returns an iterator object.
The iterator has a next() method that is used to control the execution.
1. yieldkeyword:
The yieldkeyword is used to produce a value and pause the generator.
when next() is called again, the generator resumes execution from the point where it was paused.

Example of Generator Function:

function* generatorFunction(){
   console.log("start");
   yield 1;
   console.log("Resume");
   yield 2; 
   console.log("End");

}
const gen = generatorFuntion();
console.log(gen.next());
console.log(gen.next());
console.log(gen.next());

Output

start 
{value: 1, done: false}
Resume
{value: 2, done: false}
End
{Value: undefined, done: true}

How it Works

Exectution on next():
- when next() is called for the first time, the generator starts execution and runs until the first yield.
- it returns and object {value, done}, where:
  - value: The value produced by yield.
  - done: A boolean indicating whether the generator has completed
Pause and Resume.
- The function pauses execution when it encounters yield.
- It resumes from the paused when next() is called again.
completion:
- when the generator function completes, the done property becomes true.

Reverse a string in JavaScript without using reverse()

Imran Shaik — Sun, 22 Dec 2024 10:16:56 +0000

Here is the JavaScript program to reverse a string without using the reverse() method

function reverseString(str){
    let reversed= '';
    for(i=str.length-1; i>0; i--){
    reversed += str[i];

}
return reversed;
}
const originalString = "Hello world";
const reveresedString = reverseString(originalString);

console.log("original String", originalString);
console.log("reversed string", reveresedString );

Explanation

The function reverseString takes the input as string
It iterates through the string from the last character to the first
Each Character is appended to the reversed string in reverse order
Finally the reversed string is return.

This Program avoids the use of reverse() and achieves the desired functionality.

Detailed: How it works.

str[i]: Access the character at index i in the string str

for Example, if str == "Hello ": ** str[4]** is 'o' ** str[3]** is 'l'

reversed += str[i]: this is shorthand for reversed = reversed + str[i]
- it takes the current value or reversed, appends str[i] to it, and then updates reversed with this new value.

*Iterative Process: *
Let's break it down for str = "abc"

Initial state:

reversed=""(Empty string);
Loop start at i=2(last character of the string)

Iteration 1 (i=2);

reversed +=str[2] -> reversed = "" + "c" -> reversed ="c" Iteration 2 (i=1);
reversed +=str[1] -> reversed = "c" + "b" -> reversed = "cb" Iteration 3 (i=0);
reversed +=str[0] -> reversed = "cb" + "a" -> reversed ="cba"

Final Output:

reversed = "cba"

Why use += ?

The += operator simplifies the process of building the reversed string incrementally without needing an array or additional logic. It's efficient purpose in JavaScript

Different Ways to find maximum number in javascript

Imran Shaik — Thu, 12 Dec 2024 09:39:22 +0000

There are several ways to find the maximum number in javascript. they are as follows:

Using Max.math() with spread operator :

let arr = [89, 3, 2, 66, 3, 64, 100, 35] let max = Math.max(...arr) console.log(max);

Using reduce() reduce method can be used to accumulate the max value by comparing each element. let arr = [89, 3, 2, 66, 3, 64, 100, 35] let max = arr.reduce((acc, curr)=>(curr>acc?: curr: acc), -Infinity) console.log(max) @here - Infinity is used to ensure that the first comparision always return the first element
using a For Loop: a ``

How do we sort an Array in Javascript without Sort function?

Imran Shaik — Tue, 19 Nov 2024 14:42:11 +0000

Sorting an array without using the default JavaScript sort function.
There are multiple ways to sort an array in JavaScript. one of the most popular is Bubble Sort

Problem - you have an array of integers, sort the array
Sorting can either be Ascending or descending.

const array = [5,3,8,6,2]

To sort an array Without using the JavaScript sort function is bubble sort.

Bubble Sort
Bubble sort is one of the simplest sorting algorithm. It repeatedly step through the list of array and compares the adjacent elements, and swap them if they are in the wrong order otherwise No swap. This process continues until the list is in sorted order.

function bubbleSort(arr){
  let n = arr.length;
  for (let i=0; i<n-1; i++){
    for (let j=0; j<n-i-1; j++){
      if(arr[j]>arr[j+1]){
        let temp = arr[j];
        arr[j] = arr[j+1];
        arr[j+1] = temp;
    }
}
  }
 return arr;
}

let array = [5,3,8,6,2]
console.log("sorted Array ", bubbleSort(array));

Here's how Bubble Sort works: An illustrated explanation is provided below.

Pass 1:
Compare 5 and 3 → Swap → [3, 5, 8, 6, 2]
Compare 5 and 8 → No swap → [3, 5, 8, 6, 2]
Compare 8 and 6 → Swap → [3, 5, 6, 8, 2]
Compare 8 and 2 → Swap → [3, 5, 6, 2, 8]
Result after Pass 1: Largest element 8 is in its correct position.

Pass 2:
Compare 5 and 3 → No Swap → [3, 5, 6, 2, 8]
Compare 5 and 6 → No swap → [3, 5, 6, 2, 8]
Compare 6 and 2 → Swap → [3, 5, 2, 6, 8]
Compare 8 and 6 → No Swap → [3, 5, 2, 6, 8]
Result after Pass 2: Largest element 6, 8 is in its correct position.

In this way it will continue to swap the element until we get the sorted array i.e: [2, 3, 5, 6, 8]

Different ways to create Objects in Javascipt

Imran Shaik — Tue, 19 Nov 2024 08:10:44 +0000

There are multiple ways to create an objects in javascript.

1. Object Literals: This is the simplest way to create an object in javascript

const obj = {
      name: "John", 
      age: 30,
      greet: function(){
      console.log("Object Literal Example")
}
}

2. Using Object Constructor: Create an Object using the Object Constructor

const obj = new object();
obj.name = "john";
obj.age = 30;
obj.greet = function(){
   console.log("Object Creation using Object Constructor");
}

3. Using Constructor Function:
Define a custom constructor function and use it to create an objects

function person(name, age){
  this.name= name;
  this.age = age;
  this.greet = function(){
  console.log(`Hello this object creation using constructor function ${this.name}`);
};
}
const john = new Person("John", 30)