Writer, Learner, JavaScript Developer, working on https://finalspaceapi.com
Image for post
Image for post
Photo by Christopher Gower on Unsplash

In the previous post, Synchronous vs Asynchronous Programming, we discussed the difference between Synchronous and Asynchronous programming in JavaScript. In this article, we will discuss what are Callbacks in JavaScript.

Callbacks

Callback is a function that is passed as an argument to another function and its execution is delayed until that function in which it is passed is executed.

Meaning, if I pass a function, let’s say function1 to another function, i.e., function2,then function1 will not be executed until function2 is executed.

Callbacks are a fundamental part of Functional Programming, and you may be already using them without knowing; methods like .map(), .filter(), and.reduce() all make use of callback functions. …


Image for post
Image for post
Photo by MORAN on Unsplash

Introduction

In this article, we will discuss What Synchronous Programming is? What Asynchronous Programming is? And whether JavaScript is Synchronous or Asynchronous?

Many developers struggle to understand topics like Callbacks, Promises, and Async/Await, one of the reasons may be not understanding the actual need and core logic behind them.

Having a good grasp of this topic can help you understand them more easily.

Example

This can be better explained with the help of an example.
Imagine you gave your friend a set of tasks:

  • Get Video Games from adjacent towns (somewhere far).
  • Get Chocolate from a nearby store.

What your friend now does is, he first completes task one and head to an adjacent town, and let’s say that takes x amount of time. Then he comes back to you, gives you video games, and then goes to perform the second task, and let’s say it takes y amount of time. The total time taken is x+y. This was just a couple of tasks but imagine there are hundreds of them, the total time is taken increases rapidly if he is a single person doing all the tasks one by one in the order they are given. …


Image for post
Image for post
Photo by WOCinTech Chat on Flickr

In this article, we will be discussing what dangerouslySetInnerHTML is, how it is used, what the differences are between dangerouslySetInnerHTML and innerHTML, and a real project where it proves to be useful.

What?

dangerouslySetInnerHTML is an attribute under DOM elements in React.

According to the official documentation, dangerouslySetInnerHTML is React’s replacement for using innerHTML in the browser DOM.

This means that if in React if you have to set HTML programmatically or from an external source, you would have to use dangerouslySetInnerHTML instead of traditional innerHTML in Javascript.

In simple words, using dangerouslySetInnerHTML, you can set HTML directly from React.

How?

First, let’s take a look at how innerHTML…


Image for post
Image for post
Photo by Fernando Hernandez on Unsplash

In this post, we are going to build a pokemon index using Pokemon API in plain Javascript. First, let’s discuss what this project is about, there will be a search bar where users can come and search for a pokemon and after the search, pokemon with its image and stats, as a result, will be shown. So, the functionality is pretty basic but you using this project as a base can tweak and make your own version of this project and add it to your portfolio.

The full version is deployed at https://poke-mon.now.sh/

This project is inspired by Chris on…


Image for post
Image for post
Photo by Markus Spiske on Unsplash

Almost everything in Javascript is an object, whether it’s an array or a function. In this post, we’ll learn three different ways to create objects in JavaScript:

  1. Object Literals
  2. New Keyword
  3. Class

Object Literals

A JavaScript object literal is a comma-separated list of name-value pairs wrapped in curly braces. Object literals encapsulate data, enclosing it in a tidy package.

Object literal property values can be of any data type, including array literals, function literals, and nested object literals.

Shorthand property names

Consider a scenario in which you have to put different variables inside an object. One way of doing it is:

With ECMAScript 2015, a shorter notation is available to achieve the same…


Image for post
Image for post
Photo by Alejandro Barba on Unsplash

In this post, we are going to discuss hoisting. We’ll be discussing what it is and why it’s important for you to know as a Javascript developer or programmer.

This article is the first of many small articles discussing key areas and terms in Javascript, such as call stack, callback, promise, async, etc.

Hoisting

Before we start discussing what hoisting is, let us first look at a simple example:

Pretty straightforward: I declared a variable, initialized some value to it, and then logged it in the console.

Now let's look at the definition of hoisting:

Simply put, it means no matter where you declare functions or variables when the code is executed, they’re moved to the top of their scope. …


Image for post
Image for post
Photo by JOSHUA COLEMAN on Unsplash

Sets are a new object type included in ES6 that allow the creation of collections of unique values. The values in a set can be either simple primitives like strings and integers or more complex object types like object literals or arrays. Think of sets as an array with no repeated elements.

There are many instances where we have an array containing many elements that we want to convert to a unique array. While it can be done by brute force on the array, checking elements, using loops, distinct callback method, etc., the best method is using set().

Syntax:

new…


Image for post
Image for post
Photo by Caspar Camille Rubin on Unsplash

In this piece, we are going to discuss closures and lexical scoping in JavaScript. Understanding closures leads to a better understanding of programming itself. If you are planning on becoming a professional programmer, questions regarding closures and their applications are widely asked during technical interviews and can be really helpful to you.

If you are a JavaScript Developer, chances are you already using closures and just don't know it. There are so many complex examples out there that just confuse you when you try to learn closures, so I’ll be using the simplest examples I could find and by the end of this piece, you should have a basic understanding of what closures are. …


Image for post
Image for post
Photo by Luca Bravo on Unsplash

Functions are one of the key components in programming. They are defined to perform a specific task and can be called again and again to execute. The main difference between functions in Javascript and other programming languages is that in javascript functions are of first-class objects, which means that they behave like objects and can be assigned to variables, array, and other objects.

This post discusses three different ways to define functions:

  1. Function Declaration
  2. Function Expression
  3. Generator Function

1. Function Declaration

Probably the most common way to declare a function. Let’s look at its syntax:

Syntax for Function Declarations

Function Declaration comprises of the keyword function followed by the mandatory name of the function and then the parameter within a pair of parenthesis (you can also define a function without an argument). Finally, within a pair of curly braces is the body of the function, which performs an actual task. …


Image for post
Image for post

When we talk about technological advancements in the last 3 to 5 years names like Artificial Intelligence, Chatbots, Augmented Reality, Machine Learning, etc. comes to our mind, but what this list is missing is “Cloud Computing” , even today there are many people, even some developers who have no idea what this actually means and how its changing the traditional way of computing, also there is still a wide misconception that cloud is another name for drive, storing data over the internet, well storage is a part of cloud computing but its more than that, so much more than that . …

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store