Flow, Typescript, Javascript 5 min read 10.23.2019

Flow, Typescript? Why to use types in JavaScript

Types are one of the main foundations of a programming language. Many execution errors in JavaScript are type errors. Have you ever called a function and received the error undefined is not a function? This happens when we try to access a property that is not defined. Since Javascript can’t locate the property, it returns it’s fallback - undefined

Why to use types in JavaScript

Why Use Types

Types are one of the main foundations of a programming language. Many execution errors in JavaScript are type errors. Have you ever called a function and received the error undefined is not a function? This happens when we try to access a property that is not defined. Since Javascript can’t locate the property, it returns it’s fallback - undefined

A good type system helps us avoid these common mistakes. By definition JavaScript is weakly typed language and it’s type system works during the code execution. The language also tries to help by silently converting value types. It works in your favor when you multiply 2 by '3' and not so much when you are trying to sum a number with a string that contains a number (if we tried to sum 2 and '3', the result would be “23”).

With growing complexity of modern JavaScript applications, the important question may rise. How to eliminate most of these mistakes and how to make the job for the programmer easier? Fortunately, there are compilers that can catch these error before runtime. The two most popular are TypeScript and Flow.

TypeScript

TypeScript uses the same syntax and semantics that we know and compiles to simple and clean JavaScript. Types are optional, and type inference allows a few type annotations to make a big difference to the static verification of your code. Types let you define interfaces between software components and gain insights into the behavior of existing JavaScript libraries.

The big advantage is that TypeScript offers support for the latest and evolving JavaScript features, including those from ECMAScript 2015 and future proposals, like async functions and decorators, to help build robust components.

These features are available at development time for high-confidence app development, but are compiled into simple JavaScript that targets ECMAScript 3 (or newer) environments.

Flow

Like TypeScript, Flow checks your code for errors through static type annotations. These types allow you to tell Flow how you want your code to work, and Flow will make sure it does work that way.

Flow is a library developed by Facebook, which makes it really easy to use it inside a React app. You can also adopt Flow incrementally and easily remove it at anytime, so you can try Flow out on any codebase and see how you like it.

Unlike TypeScript, Flow is NOT a programming language in itself, but rather a “Static Type Checker for JavaScript”. What this means is that Flow is a productivity tool that you can download and install into your local environment, which in return will analyser your code to generate insightful information

Why choose flow over TypeScript?

So we know that this type checking mechanic is pretty amazing, but why would you want to use Flow instead of TypeScript if TypeScript also has the same feature, plus more?

Out of the box

Flow can automatically infer type information from existing code and pick up any type errors by itself (TypeScript actually tries to do the same from version two). All you need to do to get this functionality (aside from installing and configuring Flow, of course) is add a single line of code:

// @flow

While if you want to use Typescript, you need to write the code in files with different extension (.ts, .tsx) and setup more complex initial configuration.

Better compatibility with some libraries/frameworks/compilers

AngularJS, itself built in TypeScript, will naturally have native support for programming in TypeScript. React, a very popular JavaScript library also developed by Facebook, works very well with Flow.

While it is true that it is possible to use TypeScript with React, the React ecosystem is originally not optimized to work well with TypeScript, often requiring additional adjustment to your code.

Why choose TypeScript anyway?

Above all TypeScript can work really well in Node.js environments. In back-end development, it’s even more important to keep track of what’s going on in your code. It also works really well with interfaces, and brings some features, like abstract classes, that can become handy if our goal is to develop complex scalable solution in the right “object oriented way”.

In combination of both back-end and front-end parts of our application, we can achieve lots of benefits, like the possibility of sharing interfaces, or parts of code, that are common for both parts of our application.

The choice

Both solutions have it’s benefits and can be more effective for different kinds of applications, you can learn more about both of them here https://www.typescriptlang.org/ and here https://flow.org/en/ Good luck with you code and remember. Choose wisely

Choose wisely

Our clients say

Client logo

With senior resources from Hiremotely, we are able to drive our digital harmonization agenda: Migration of different reporting platforms to QlikSense analytics and Harmonization of different digital detailing systems into Veeva CLM.

Jiri Matousek, Head of CRM at Hexal AG Jiri Matousek, Head of CRM at Hexal AG
Client logo

Hiremotely provided us with a top PHP developer who has been working for us for more than 4 years. Jan became indispensable part of our team within few weeks.

Dave Etchells, CEO at Imaging-resource.com Dave Etchells, CEO at Imaging-resource.com
Client logo

Each time we are in a need of new software developer, we just contact the guys from Hiremotely. Their network is huge so they provide us with demanded sources very quickly.

Martin Svach, CEO at Starkys club Martin Svach, CEO at Starkys club

Useful articles

Hire PHP Developer Guide (2021)
Daniel

Hire PHP Developer Guide (2021)

Check out this comprehensive guide on PHP so that you can feel ready to hire the best PHP Developer for you and your company! More

30. 07. 2021 . 6 min read

  • #PHP
Sharepoint Developer- How to Hire, Skills, and FAQs
Arjun

Sharepoint Developer- How to Hire, Skills, and FAQs

In this post, we will show you the most important SharePoint Developer skills you should look out for if you want to succeed (in fact, this expertise are non-negotiable) More

10. 03. 2021 . 6 min read

  • #Software developers

cancel anytime