Advanced JavaScript Concepts | Revised Version for Jr Dev's

JavaScript Revised Version

1. let, var, and const

var

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

let

function test() {
  console.log(x); 
  let x = 10;
}

const

const arr = [1, 2, 3];
arr.push(4); // Works
arr = [5, 6]; 

2. Closures

A closure is created while a function "remembers" the variables from its outer scope, even after that scope has exited. Closures are important while managing features internal different features, where the internal function keeps access to the variables of the outer function.

function outer() {
  let count = 0;
  return function inner() {
    count++;
    console.log(count);
  };
}

const counter = outer();
counter(); // 1
counter(); // 2

3. Currying

Currying is a way wherein a function takes a couple of arguments one after the other, returning a new function for each argument. It transforms a feature that takes all arguments right now into one that takes them sequentially.

function multiply(a) {
  return function(b) {
    return a * b;
  };
}

const double = multiply(2);
console.log(double(5)); // 10

4. Promises

Promises are used to handle asynchronous operations. A promise represents an operation that hasn't completed but but is anticipated to inside the future. It can be in one in all 3 states:

1. Pending: Initial country, neither fulfilled nor rejected.
2. Fulfilled: Operation finished successfully.
3. Rejected: Operation failed.

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Success!");
  }, 1000);
});

myPromise
  .then((value) => console.log(value))  // "Success!"
  .catch((error) => console.log(error));

Promises are extensively utilized in present day JavaScript to address async code in a cleanser way in comparison to callbacks.

5. Hoisting

Hoisting is JavaScript's default conduct of moving declarations to the top of their scope earlier than code execution. Only the declarations are hoisted, now not the initializations.

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

In the case of var, the assertion is hoisted, but the fee venture takes place later. In evaluation, permit and const are not initialized till the code executes them, leading to a "temporal lifeless quarter" where they can't be accessed.

console.Log(y); 
let y = 10;

6. IIFE (Immediately Invoked Function Expression)

An IIFE is a function that is finished straight away after it is described. IIFEs are useful for growing a private scope to avoid polluting the global scope, which was specifically essential before the arrival of modules.

(function() {
  console.log("I am an IIFE");
})();

The feature is wrapped interior parentheses and is invoked at once after the remaining parentheses.

7. First-Class Functions (Citizen Functions)

In JavaScript, functions are great residents. This method that they can be assigned to variables, passed as arguments to other functions, and returned from other features.

const greet = function(name) {
  return `Hello, ${name}`;
};

function sayHello(greetFunction, name) {
  console.log(greetFunction(name));
}

sayHello(greet, "John"); // Hello, John

8. Variable Functions (Function Expressions)

In JavaScript, you may outline functions in two ways: the usage of function declarations and function expressions. A function expression is while you assign a feature to a variable, permitting it to behave like every other variable.

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

console.log(add(2, 3)); // 5

Function expressions allow for extra dynamic conduct in comparison to feature declarations.

9. Callbacks

A callback is a feature this is surpassed as a controversy to any other function and is achieved after a few operation is whole. Callbacks are closely utilized in JavaScript for asynchronous operations, which include dealing with user occasions or fetching information from a server.

function fetchData(callback) {
  setTimeout(() => {
    callback("Data loaded");
  }, 1000);
}

fetchData((data) => {
  console.log(data); // "Data loaded"
});