How to Validate JavaScript Object Better with TypeScript

image borrowed from TheHoot
  • Too many ifs
  • Errors are thrown one by one
  • Handles error via throwing exception

How to make things better

Async Function and Promises

  • Async functions returns aPromise. But a normal function can return a Promise without being labeled as async.
  • Promise can be resolved/rejected with any value, or results in an Error exception
  • Async functions can be composed into a Promise chain
  • If you wait for async function with await, that means you are inside async function
  • Error exception and rejection break Promise chain at once
  • You can start an async function inside async function
  • Currently there’s a warning if you don’t handle promise rejection in Node and Chrome

Type All the Things

Missing return type on function.eslint(@typescript-eslint/explicit-function-return-type)

Type Guard

Running Validations Synchronously

  • takes an array of functions that accept same input (a.k.a Validate functions)
  • also take an input object to be validated
  • and it return either an array of Invalid or the original input object.
  • mapover the functions and execute them with the input object.
  • make sure that we catch the Error exception and put it inside Invalid because we want to collate the result
  • check the results and group the Invalid into an array with reduce
  • if errors found is greater than zero, return an array of Invalid otherwise return the original object. Note that this needs to be done via Type Guard, otherwise the TypeScript compiler might complain.

Types for Asynchronous Validation

Running Validations Asynchronously

  • Similar to the runValidations, we map over the functions and execute them with the input object
  • At the core, we are usingPromise.all to asynchronously get the value out of the validation promises
  • However before passing it to Promise.all, we need to append each Promises to have catch and turn the catched errors into Invalid
  • The rest are again similar to runValidations, group the validation results via reduce and use areInvalid Type Guard to determine what to return

Why can’t we just use Promise.all ?

Why can’t we just chain the validations?

Epilogue

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

React Navigation 3.X with example code — Part 2 — DrawerNavigator

Boost your Front End Development with these tools

Leetcode Q57. Insert Interval

Integrating Google Calendar API to web app using serverless Node.js functions (Part 2 of 2)

JavaScript ES 2017: Learn Async/Await by Example

Stop Using Redux — Consider Easy Peasy if You Want

person with an arm upraised in a “stop” motion

Redux Persist In React Application

Data Visualisation with D3 journal Part: 5

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
Djoe Pramono

Djoe Pramono

More from Medium

Typescript with Grafikart, my resume

is JavaScript /TypeScript Math broken? Behind Float Number Operations

Expose Observable methods as Promises

Photo by Kelly Sikkema on Unsplash

TypeScript vs JavaScript