Posts | Techformist

Practical guides, tutorials, and insights from years of building web and desktop applications. Check out code examples you can actually use!

Javascript date feature that I could have lived without

Be aware of hidden Javascript features that can break your code before you say “ugh..”. Consider the below code that prints today’s date - const dt = new Date(); console.log("dt: ", dt); // 2019-03-31T13:56:42.552Z All looks good? Let us now create a target date for my payment - it is 1.5 months from now. const dt1 = new Date(2019, 05, 15); console.log("dt1: ", dt1); // 2019-06-14T18:30:00.000Z // well - diff. time-zone causes one day prior // .. but that's ok Don’t mind the day gap, we are just living in the wrong time zone. We are happy with 15-Jun allright. ...

Concat vs. Push for Arrays in Javascript

Someone once said “there shall be standards, and there were standards”. But no one said anything about consistency, uniformity, and stuff like that? The question is of course not about standards. Let me ask you this one thing - do you have any idea what’s going on with push and contact? Here’s concat.. const nums = [1, 1, 2, 3]; console.log("nums.contact(): ", nums.concat(5)); // [ 1, 1, 2, 3, 5 ] console.log("length: ", nums.length); // 4 And then, there’s push.. ...

Gotchas of Singleton Classes in Javascript

Be careful about using singleton patterns in Javascript classes. It may have unexpected side-effects and can be the most dreaded evil overlord you encounter on that day. Let us take this example of an Account class that is used by all logged-in users. Users set a role and are shown accounts based on the role. "use strict"; const role = "mortal"; class Account { getAccounts() { console.log("this.role: ", this.role); if (this.role == "mortal") return "mortal accounts"; else if (this.role == "manager") return "hail manager..! here's all accounts"; } setRole(roleVal) { this.role = roleVal; } } module.exports = new Account(); Let’s consider the below test class that calls the Account class. ...

Class Methods and Comma in Javascript

Where does a comma fit in the class methods? No where. Where do I remember it from, then - Vue objects. When I started using Vue full time some time in 2017, I had this problem with putting commas everywhere. These were becoming like issues with semicolons - except that VS Code Prettier takes care of my semi-colons. Back to classes and commas - we will get back to Vue in a bit. ...

Newbie Mistakes in Creating Promises in Javascript

Promises and promise chaining - really powerful tools to use and make your life as easy as it can be. Until you are stuck in an error that no one seems to have a clue about. Let us see some common errors and how to fix them. 1. Not use error handling in promises It does not demand a lot, people. Just do it. (Oh, wait I have been guilty of it as hell.) ...

Chain Promises in Javascript

A chain promises to process data through a promise-laden gold field. A simple promise - let promiseToLog = new Promise(function(resolve, reject) { console.log("started"); setTimeout(function() { resolve("promise fulfilled.. after timeout"); }, 300); }); console.log("promise initialized"); promiseToLog.then(function(val) { console.log("resolver", val); }); As you have seen earlier the promise gets initialized and next statement (‘promise initialized’) gets executed without waiting to resolve promise. What if you want to execute something after the promise is resolved? This is where promise chaining comes in. You can chain the then statements to tie multiple executions to a single promise. ...

Ways to a Promise in Javascript

You already know that promises enable us to carry out asynchronous transactions. How do you implement in your own programs? I assume you already know what promises do in Javascript](/promises-javascript) and how event driven programming works :) Javascript promise is an object. So, Promise should be as easy as using an object. As it is typical in Javascript, everything seems easy, and then stacks up all the different ways to amaze and confuse mortals. ...

Promises in Javascript

Promises enable us to carry out asynchronous transactions. Javascript promise is an object, as we all are. It is a way for the program to initiate “something”, and not wait for the process to complete (=‘async operations’). Runtime engine calls the call back function once the process completes - thereby completing the loop. At first, there were call backs. Call backs were everywhere in Javascript and sure made people hate their lives. Promises are a super-hero version of call backs - they provide a lovable er.., readable way to call services and manage their output and errors. ...

Event Driven Programming

Javascript is an event-driven programming language. Logic is triggered by a user or system action, and the flow of action continues to be determined by events along the way. These events can be user-input like clicks, system operations like completion of DB read, completion of file load, etc. Events are handed by the event handlers that are defined by you or the underlying ecosystem. The flow of events can be something like below - ...

Delete Array Elements while Iterating Array in Javascript

Removing array elements while iterating through the elements in a loop can be tricky for a beginner. Consider this - const nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; for (let i = 0; i < nums.length; i++) { console.log(nums[i]); nums.splice(i, 1); } This looks like a lazy weekend programming puzzle, but also goes to demonstrate what can happen if the loop is not understood well. The above code does not delete all elements but removes alternate elements. console.log(nums); // [ 2, 4, 6, 8, 10 ] In the for loop splice removes one element each time. When we step through time - ...