Objects are everywhere in JavaScript. Functions are Objects, Arrays are Objects. Hell even Classes are Objects, well not exactly. Classes are Functions but again Functions are Objects :D!

Welcome to Prototypal Inheritance:

JavaScript does not work the traditional way of using classes as blueprints to create objects, but rather objects as blueprints. Suffice to say this has hurt the sentiments of many. But how does it work?

Every object in JavaScript has got a Prototype chain attached it which is a set of objects linked with the internal hidden property [[Prototype]]. …


Create your own custom components using CustomElementRegistry !!!

Creating non-standard HTML Elements are fairly easy and we can use javascript to make such elements functional. Such components become an instance of HTMLUnknownElement as shown below:

The limitation is that we can’t extend the existing DOM functionalities to make the component reactive to various changes. We are also limited to accessing the components and separately binding the functionalities on each component instead of defining the standards at one place.

Reusable Custom HTML Elements:

Normally all standard components have their own constructors defined by the user-agent. All these components also extends from base HTMLElement constructor.


Imagine the possibilities of a function which can be stopped at any point and can return multiple values with valuable inputs from the outer environment.

Generator functions are special functions that can yield multiple values and are especially useful to create data-streams for iterables.

Normally a return statement stops the execution of a normal function and returns a value, however in a generator function, we can pause the execution of the function using yield keyword to return a specific value and can resume it later whenever needed thus returning as many values as there are yields present.

Let’s check the…


IndexedDB is a transactional database which lives in the browser and is an asynchronous and key-value based object store with no strict data storage limits as long as the user permission and free space is there. Sounds pretty badass right?

Okay, so here are some of the things that I really like about indexedDB:

  • It is a transactional database, meaning you can wrap multiple related operations in one transaction and if any operation fails, all other changes will be reverted back to the previous state as if the transaction never even happened. This ensures that the data is reliable.
  • indexedDB


JavaScript in browser environment uses an Event Driven Architecture. What it means is we can execute our code in response to certain user behaviours like clicking a button or focusing an input.

The important thing here is that DOM (Document Object Model) is a system that provides us the access to interact with the Document and our code is not directly connected. We need our system to be able to respond to different DOM events and event listeners are the way we couple our system to the DOM to make it interactive.

The idea here is to be able to…


Event Listeners help us in binding functions which are called when that event is emitted, like scrolling or resizing.

But what if the event is called multiple times in a very short span of time? If the function called by the listener is intensive, it can severely impact performance.

Debouncing and Throttling are really useful under such scenarios.

Throttling

Throttling essentially let’s you execute a function only once in a given period of time.

If the time duration given is 500 milliseconds, no matter how many times the event is emitted in those 500 milliseconds, the event will only execute once…


Let’s talk about the raw way of writing functions. Functions perform certain set of actions according to our requirements which could include fetching data, updating State, changing a set of mutable values and updating the DOM and so on.

And then our code base gets bigger and bigger and after a specific point, we have to deal with bugs. Arrrgh!

Fixing bugs most of the time is a tedious process because you have to go through potential culprits and sometimes there’s a lot! We fix them, then we have more bugs and the vicious cycle continues! At some point we…


Hi /fellas/g ! I know it looks weird but that addresses all fellas globally. Too nerdy? So is Regex. This one’s a beauty but you need to explore it to know it’s powers. I first realized that when I wanted to remove spaces of a string for some weird reason.

Obviously one solution to this is String.split(“ ”).join(“”):

However creating an Array to remove the spaces seemed too dirty to me. I am not sure if I have OCD!

So I went with String.replace(“ ”,“”). This doesn’t work for the simple fact that it only targets and removes one…


HOW TO DEPLOY YOUR FIRST REACT APP TO GITHUB PAGES!

Hi All,

This is my first blog and I am very new to React. So this post is going to be probably just random words thrown together and might not make much sense ;).

But anyways here I am writing this post mainly because I had a hard time deploying my React App to GitHub Pages and I would love to alleviate the suffering for the new React Developers who just want to deploy their work.

Now the first thing most of you will see when you search for deploying React to GitHub is ‘gh-pages’. …

Ashwin Kumar

Web Developer, JavaScript Enthusiast, Love to Code.

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