Javascript is one of the most popular programming languages in 2023. It is because of it's multiple growing use cases and simple syntax. But at times, some concepts are forgotten by most of the developers so this blog tries to address such 6 concepts.
Promise
A promise is an object in javascript that represents a value that is going to be fulfilled or rejected in the future. Most often, we as developers tend to consume promises given to us or by libraries so handling promises with then
and catch
block is important to understand.
let dataFetched = true;
const dataIsFetched = new Promise((resolve, reject) => {
if(dataFetched) {
resolve("Data Fetched");
} else {
reject("Some Error Occured");
}
}
dataIsFetched()
.then((msg) => console.log(msg))
.catch((errMsg) => console.log(errMsg));
Closures
The closure is a concept of function inside a function where the inner function can access and modify the variables from the outer function. Using this concept, we can do some amazing things like encapsulation and implement decorators and generators, asyncronous code, etc.
function outerFunction() {
let userName = "John";
function innerFunction() {
console.log(userName);
}
return innerFunction;
}
const inner = outerFunction();
inner();
Higher Order Functions
Higher order functions are those functions that take function as arguments or return functions as return value. Array methods like .map
, .reduce
, .forEach
, etc all are higher order functions.
function isOdd(num) {
return num % 2;
}
function takeFilteredElements(array, condition) {
const returnArr = [];
for(let i = 0; i < array.length, i++) {
if(condition(array[i])) {
returnArr.push(array[i]);
}
}
return returnArr;
}
console.log(takeFilteredElements([1, 2, 3, 4, 5, 6], isOdd));
Recursion
The concept of recursion is that a function calls itself until a base condition is reached. There are two compulsory parts in a recursive function.
Base Case: It is the simplest case that a function may arrive. Like 0 factorial is 1.
Recursion: This is the place where recursion occurs where a function is called again and again.
function findFactorial(num) {
if(num < 0) return -1; // Value of num can not be negative
if(num == 0) return 1; // Simplest base case
return num * findFactorial(num - 1);
}
console.log(findFactorial(6)); // Output: 720
Async/await
Async/await is nothing but just a wrapper on the Promise API. It is used for asynchronous programming for fetching data from file or database or request.
async: It is used to tell that the function or method is going to have await inside it
await: It is used to stop the current execution of the function and take the execution context to another part until the operation is completed.
async function getTodo() {
const response = await fetch("https://example.com/api");
const data = await response.json();
console.log(data);
}
In the example above the await fetch
part runs and the execution is given to some other code but after the response
is there. It is converted to json
which is an expensive process so again it is given inside await
.
Array methods
Array methods are important methods that are often overlooked by most developers when learning about Arrays
and try to implement their function operation on the array.
Some of the most important array methods are:
Array.map:
It iterates over all elements and returns a new array with return valueArray.forEach:
It iterates over all elements of the array but does not return any value.Array.filter:
It filters the elements of an array that met certain conditions return filtered array.Array.some:
It checks if any element of an array met a certain condition and returns a boolean.
Conclusion
Apart from these, many other javascript concepts are important and often forgotten but this blog tries to cover 6 of them.
Thanks for reading this article. If you found this helpful, please support this with a reaction, comment or share.