Category: JavaScript

Generator function is a function that can pause, accept some input and run again.

Invoking a generator function

Consider the printHello function which returns “Hello world”

function* printHello() {
  yield 'Hello world';
}

When a function has an asterix (*) as suffix, it becomes a generator function. How do we invoke a generator function?

const iterator = printHello();
let result = iterator.next();
…
Read More

It is easy to convert an SVG element into an image. Serialize the SVG element into a Base64 string and set the image src attribute.

const serializer = new XMLSerializer();
const svgString = serializer.serializeToString(svgElem);
const img = new Image();
img.src = 'data:image/svg+xml;base64,' + Base64.encode(svgString);

It is easy to save the image to a file. We do this using the Canvas toBlob and window saveAs API.…

Read More

I use ES6 promises (and not the async / await pattern). Promises were the promise to avoid the Christmas tree problem of nested callbacks. Consider three API calls. Using promises, the code will look like so.

const promiseA = Promise.resolve(42);
const promiseB = Promise.resolve(87);
const promiseC = Promise.resolve(111);

promiseA
  .then(r => promiseB)
  .then(r => promiseC)
  .then(() => {});

It looks pretty neat.…

Read More

Async / await in JavaScript makes async programming look synchronous. The code for importing a row of data using async / await pattern looks like below.

async function validateAndImportRow(row) {
  const isValid = await validateRow(row);
  if (isValid) {
    await import(row);
  }
  return isValid;
}

I am a late adopter of almost everything. For example, it was not until 2003 when I got my first mobile phone.…

Read More

I took a formal Mongo course by Stephen Grider on Udemy. I am very happy with the way Stephen teaches. It is slow. Very relevant and practical. I feel accomplished and satisfied after the course. I prepared a few interview questions on Mongo and Mongoose which are quite useful.

  1. How do you create a model with Mongoose?
  2. What is the difference between an embedded document and an associated document?
…
Read More

ES2015 introduces Promise API as a replacement for callbacks. There are a few things that you may not know.

Promise and the Event Loop

Consider the following async code.

setTimeout(someFunc, 1000);

setTimeout function waits for one second and then places the function someFunc at the end of the event loop. All other functions in event loop are processed before someFunc is taken up for processing.…

Read More

The ultimate guide to JavaScript class pattern explains how the prototype chain works. It explains how we can chain multiple prototypes together. However, for the sake of simplicity, I left out how a put operation on an object property works. Most misunderstandings in JavaScript arises from the assumption that the put operation works similarly to the get operation. Unfortunately, that is not how it works.…

Read More

Consider an empty object. Print the object using toString method.

const obj = {};
console.log(obj.toString()); // [object Object]

We get the result [object Object] in the console. How does it work? (Interview question). Developers who have a strong background in C++ or C# will blindly attribute it to OOPs. All objects inherit from Object.

JavaScript is to Java what Cartoon is to Car.

…
Read More