JS Expert – EligoCS

Master JavaScript From Basics to Advanced Programming Skills.

Explore the fundamentals and advanced concepts of JavaScript with our comprehensive and hands-on online course for web development mastery.

Strat Your Test Now Dear learners, Are you interested in assessing your progress? Request your mentor to give you access and start your Test.

“Explore the fundamentals of JavaScript programming with our comprehensive course. Learn to create interactive web applications, manipulate the DOM, and master essential JavaScript concepts for dynamic development.”

Learn More About JS

1. Functional Programing :

Functional programming is a programming paradigm that treats computation as the evaluation of mathematical functions and avoids changing state and mutable data. In JavaScript, while the language supports multiple programming paradigms, it provides features that enable functional programming.
First-Class Functions:
- Functions are first-class citizens, meaning they can be assigned to variables, passed as arguments to other functions, and returned from functions.

HTML

const add = (a, b) => a + b;
const multiply = (a, b) => a * b;

const calculate = (operation, a, b) => operation(a, b);

console.log(calculate(add, 5, 3));      // Outputs: 8
console.log(calculate(multiply, 5, 3)); // Outputs: 15

OUTPUT

8
15

Higher-Order Functions:

Functions that take one or more functions as arguments or return a function are called higher-order functions.

HTML

const multiplyBy = (factor) => (num) => num * factor;

const double = multiplyBy(2);
console.log(double(5)); // Outputs: 10

OUTPUT

Immutability:

Functional programming promotes immutability, meaning once a data structure is created, it cannot be changed. Instead, new structures are created.

HTML

const originalArray = [1, 2, 3];
const newArray = [...originalArray, 4]; // Create a new array with immutability

OUTPUT

[1, 2, 3, 4]
[1, 2, 3]

Pure Functions:

Pure functions are functions that always return the same result for the same input and have no side effects. They do not modify external state or variables.

HTML

const pureAdd = (a, b) => a + b;

OUTPUT

I'm global"

Recursion:

Functional programming often utilizes recursion instead of iteration for repetitive tasks.

HTML

const factorial = (n) => (n === 0 ? 1 : n * factorial(n - 1));

OUTPUT

 10
 ReferenceError: x is not defined

Functional Composition:

Combining functions to create new functions is a common practice in functional programming.

HTML

const compose = (f, g) => (x) => f(g(x));

const addOne = (x) => x + 1;
const multiplyByTwo = (x) => x * 2;

const addOneAndMultiplyByTwo = compose(multiplyByTwo, addOne);
console.log(addOneAndMultiplyByTwo(3)); // Outputs: 8

OUTPUT

Imperative Programming:

In imperative programming, code describes how the program should achieve a specific result. It focuses on the step-by-step process and often involves explicit instructions and control flow.

Comparison:

Imperative:
- Describes the step-by-step process.
- Focuses on how things should be done.
- Often involves mutable state and explicit loops.
Declarative:
- Describes the desired outcome.
- Focuses on what should be done.
- Often involves higher-order functions and immutability.

HTML

// Imperative way to find the sum of squares of even numbers
const numbers = [1, 2, 3, 4, 5];
let sum = 0;

for (let i = 0; i < numbers.length; i++) {
  if (numbers[i] % 2 === 0) {
    sum += numbers[i] * numbers[i];
  }
}

console.log(sum); // Outputs: 20

OUTPUT

Declarative Programming:

In declarative programming, code focuses on what the program should achieve, describing the result rather than the step-by-step process. It often involves higher-level abstractions and allows for a more concise and readable code.

HTML

// Declarative way to find the sum of squares of even numbers using functional programming
const numbers = [1, 2, 3, 4, 5];

const sumOfSquares = numbers
  .filter(num => num % 2 === 0)
  .map(num => num * num)
  .reduce((acc, value) => acc + value, 0);

console.log(sumOfSquares);

OUTPUT

Call Back Functions:

a callback function is a function that is passed as an argument to another function and is executed after the completion of some asynchronous operation or at a specified time. Callback functions are commonly used in scenarios like handling events, making asynchronous requests (e.g., AJAX calls), or performing operations after a certain task completes.

HTML

// Synchronous Callback
function doSomething(callback) {
  console.log("Doing something...");
  callback();
}

function onComplete() {
  console.log("Operation complete!");
}

doSomething(onComplete);

OUTPUT

Doing something... 
Operation complete!

higher order functions (map & forEach) :

In JavaScript, higher-order functions are functions that take other functions as arguments or return functions. Two commonly used higher-order functions for iterating over arrays are map and forEach.
map Function:
The map function is used to transform each element of an array and create a new array with the results.

HTML

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

const squaredNumbers = numbers.map(function (num) {
  return num * num;
});

console.log(squaredNumbers);

OUTPUT

    [1, 4, 9, 16, 25]

`forEach` Function:

The forEach function is used to iterate over each element of an array and perform an action for each element.

HTML

const fruits = ['apple', 'banana', 'orange'];

fruits.forEach(function (fruit) {
  console.log(fruit);
});

OUTPUT

apple

banana

orange

find, findindex , some & every in js

In JavaScript, find, findIndex, some, and every are array methods that provide different ways to iterate over arrays and perform specific operations on their elements.

`find` Method:

The find method is used to find the first element in an array that satisfies a provided testing function. It returns the value of the first element found, or undefined if no element satisfies the condition.

HTML

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

const foundNumber = numbers.find(function (num) {
  return num > 2;
});

console.log(foundNumber);

OUTPUT

`findIndex` Method:

The findIndex method is similar to find, but it returns the index of the first element that satisfies the provided testing function, or -1 if no element satisfies the condition.

HTML

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

const index = numbers.findIndex(function (num) {
  return num > 2;
});

console.log(index);

OUTPUT

2 (index of the first element greater than 2)

`some` Method:

The some method tests whether at least one element in the array satisfies the provided testing function. It returns a boolean value.

HTML

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

const hasEvenNumber = numbers.some(function (num) {
  return num % 2 === 0;
});

console.log(hasEvenNumber);

OUTPUT

true (because there is at least one even number)

`every` Method:

The every method tests whether all elements in the array satisfy the provided testing function. It returns a boolean value.

HTML

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

const allNumbersAreEven = numbers.every(function (num) {
  return num % 2 === 0;
});

console.log(allNumbersAreEven);

OUTPUT

false (because not all numbers are even)

Filter Method:

The filter method is an array method in JavaScript that creates a new array containing all elements that pass a provided test implemented by a provided function. It doesn’t modify the original array but returns a new one.

Common Use Cases:

Filtering an array based on a specific condition.
Selecting elements that meet certain criteria.
Removing elements that don’t satisfy a condition.

The filter method is widely used in JavaScript for creating subsets of arrays based on specific conditions, providing a clean and functional approach to data manipulation.

HTML

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

// Using filter to get even numbers
const evenNumbers = numbers.filter(function (num) {
  return num % 2 === 0;
});

console.log(evenNumbers);

OUTPUT

[2, 4, 6] (an array containing only the even numbers from the original array)

Changing Method:

It seems like there might be a bit of confusion in your question. If you are asking about changing elements in an array in JavaScript, you might be referring to methods like map or forEach which can be used to transform or modify array elements.

`map` Method:

The map method creates a new array by applying a function to each element of an existing array.

HTML

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

const squaredNumbers = numbers.map(function (num) {
  return num * num;
});

console.log(squaredNumbers);

OUTPUT

[1, 4, 9, 16, 25] (a new array with each element squared)

`forEach` Method:

The forEach method executes a provided function once for each array element.

HTML

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

numbers.forEach(function (num, index, array) {
  array[index] = num * 2;
});

console.log(numbers);

OUTPUT

[2, 4, 6, 8, 10] (original array modified, each element doubled)

Object-oriented programming (OOP):

Object-oriented programming (OOP) is a programming paradigm that uses objects to organize and structure code. JavaScript is a multi-paradigm language that supports object-oriented programming. Here are the key concepts of OOP in JavaScript:

Objects and Classes:

JavaScript allows you to create objects either through object literals or constructor functions. With the introduction of ES6, classes were introduced as a syntactical sugar over constructor functions for creating objects.

HTML

const person = {
  name: "John",
  age: 30,
  sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

person.sayHello();

OUTPUT

Hello, my name is John

Encapsulation:

Encapsulation involves bundling the data (properties) and the methods (functions) that operate on the data into a single unit, i.e., an object. This helps in hiding the internal details of the object and exposing only what is necessary.

Inheritance:

Inheritance is a mechanism that allows a class (or constructor function) to inherit properties and methods from another class. In JavaScript, this is achieved through the prototype chain. JavaScript allows you to create objects either through object literals or constructor functions. With the introduction of ES6, classes were introduced as a syntactical sugar over constructor functions for creating objects.

HTML

class Animal {
  constructor(name) {
    this.name = name;
  }

  speak() {
    console.log(`${this.name} makes a sound`);
  }
}

class Dog extends Animal {
  speak() {
    console.log(`${this.name} barks`);
  }
}

const myDog = new Dog("Buddy");
myDog.speak();

OUTPUT

Buddy barks

Polymorphism:

Polymorphism allows objects to be treated as instances of their parent class. This allows for flexibility in the structure and behavior of the program.

HTML

class Shape {
  draw() {
    console.log("Drawing a shape");
  }
}

class Circle extends Shape {
  draw() {
    console.log("Drawing a circle");
  }
}

class Square extends Shape {
  draw() {
    console.log("Drawing a square");
  }
}

const shapes = [new Circle(), new Square()];

shapes.forEach(shape => shape.draw());

OUTPUT

 Drawing a circle
 Drawing a square

‘This’ keyword :

The this keyword is a reference variable that refers to the current object. Here, we will learn about this keyword with help of different examples.

HTML

var address=  
{  
company:"EligoCS",  
city:"SHIMLA",  
state:"HP",  
fullAddress:function()  
{  
return this.company+" "+this.city+" "+this.state;  
}  
};  
  
  
var fetch=address.fullAddress();  
document.writeln(fetch);

OUTPUT

 EligoCS SHIMLA HP

Dear learners, Are you interested in assessing your progress?
Request your mentor to give you access and start your Test.

Master JavaScript From Basics to Advanced Programming Skills.

Learn More About JS

1. Functional Programing :

HTML

OUTPUT

HTML

OUTPUT

HTML

OUTPUT

HTML

OUTPUT

HTML

OUTPUT

HTML

OUTPUT

Imperative Programming:

Comparison:

HTML

OUTPUT

Declarative Programming:

HTML

OUTPUT

HTML

OUTPUT

map Function:

HTML

OUTPUT

forEach Function:

HTML

OUTPUT

find, findindex , some & every in js

find Method:

HTML

OUTPUT

findIndex Method:

HTML

OUTPUT

some Method:

HTML

OUTPUT

every Method:

HTML

OUTPUT

Filter Method:

Common Use Cases:

HTML

OUTPUT

Changing Method:

map Method:

HTML

OUTPUT

forEach Method:

HTML

OUTPUT

Object-oriented programming (OOP):

Objects and Classes:

HTML

OUTPUT

Encapsulation:

Inheritance:

HTML

OUTPUT

Polymorphism:

HTML

OUTPUT

‘This’ keyword :

HTML

OUTPUT

Journey Through Information

with our Entertaining

And Informative Quizzes.

Useful Links

Subscribe Now

`map` Function:

`forEach` Function:

`find` Method:

`findIndex` Method:

`some` Method:

`every` Method:

`map` Method:

`forEach` Method: