Intro to TypeScript the friendlier Javascript

Steve K
3 min readSep 14, 2020

--

TypeScript Enhances Scalability by Gints Dreimanis, Olga Bolgurtseva

Recently as I was updating and cleaning up some older Javascript web applications I designed early on in my coding Bootcamp. I always come back to the same initial thought. Javascript can be daunting on its own with the added functionality and inside complex larger applications, it can be very difficult to refactor or adjust as needed. It's largely why frameworks like React and Angular have become so popular because of the structure they provide. It was in the middle of a conversation with a fellow developer on Slack that they suggested TypeScript a superset to Javascript that introduces static typing.

This sounded great as I like Javascript I prefer it with structure and this is exactly what TypeScript excels at. According to TypeScript documentation, it operates like a linter for Javascript. It can be compiled with instructions that a compiler will understand. Because of this TypeScript is relatively easy to pick up and implement as opposed to languages like CoffeeScript and PureScript. This can be seen because any Javascript file is valid TypeScript. This makes it very beginner-friendly as Typescript will continuously seek to meet you halfway. Even when type errors are found in the initial compile phase it will still return javascript that worked before. In a lot of ways, TypeScript operates like spellcheck for Javascript in terms of what it does.

Because Typescript is compiled Javascript it can be used anywhere Javascript could be used this includes the backend. Breaking down the core functionality of TypeScript would be explaining the types it implements. Below is a chart of data types.

Supported Data Types image provided by Aditya Malivya

As you can see these data types are fairly standard in most if not all high-level programming languages. The key difference is all programming languages fall into two groups static typing and dynamic typing. Static typing means during the compile phase a declared variable should be inferrable and easily interpreted as a number, boolean, or string. Dynamic typing differs by variable typing is confirmed during execution when running the program. By default, JavaScript does not support static typing. With the introduction of TypeScript expressing the intention of your execution block becomes a bit clearer. This means introducing new undefined variables will come with compile warnings. Because of this added layer of interpretation of code, it becomes easier for the computer to understand and remember the surrounding context. This may seem like a way to bloat complexity further but because of the enhanced linting TypeScript becomes more reliable and easier to refactor.

As I become more acquainted with this new tool for JavaScript we can dive into the advanced types that TypeScript provides which are user-defined types. These are customized type guards that guarantee a type is within scope.

--

--

No responses yet