Before going technically deep into TypeScript, let’s see some history and background of TypeScript. TypeScript is a free open-source programming language developed and maintained by tech giant Microsoft and it is made public in October 2012 . It supports class-based object-oriented programming.
The definition for TypeScript provided in (https://www.typescriptlang.org/) is – “TypeScript is a typed superset of JavaScript that compiles to plain JavaScript”. Angular uses TypeScript which is a major language for developing of Angular applications.
Why and When to use TypeScript?
As JavaScript developers, we encounter different challenges especially on large JavaScript application or enterprise-scale type of JavaScript apps. If we don’t follow some of the patterns like Revealing Module Pattern in our JavaScript app then it tends to bit messy and as a result it leads to lack of maintainability, lack of reuse if we don’t do it right. We want something that’s very maintainable and easy to work with and that’s one of the things that TypeScript can really do.
Another challenge that can come up is, as developers move from pure server-side or a desktop app coding find themselves hard to learn JavaScript and that’s kind of how we get into the messy code situation. TypeScript has several different features that will appeal to enterprise-scale JavaScript developers and any JavaScript developers looking for modularity, encapsulation of code and some of the other features.
What is TypeScript Compiler?
While we code in TypeScript , we’ll be writing this in a file having .ts as it’s extension. By using TypeScript complier (run – tsc filename.ts) we’ll run this .ts file, this execution step requires when our tool doesn’t support the compilation process directly. This doesn’t require in Visual Studio, because after saving the .ts file it will automatically converted to a .js file behind the scenes for us, so it makes really easy with the tools.
TypeScript Keywords and Syntax
Writing code using TypeScript is actually straightforward if you already have a background in JavaScript or even an OOP based languages like Java, C++ etc. It follows the same syntax rules in JavaScript like –
· { } to define code block
· Semi-colon to end code expression
· JavaScript keywords – for, if, switch and more.
In the below picture, you can find some useful Keywords that can be used in TypeScript.
TypeScript Code Hierarchy
One of the best ways to get started learning TypeScript to head over to https://www.typescriptlang.org/ . There you can find useful documentation and also a Playground option to work on TypeScript right in your browser without any editor.
Tools for TypeScript
1. One of the useful tool to work with TypeScript is Visual Studio. The ts file is going to be the TypeScript file but what’s really nice about Visual Studio is that it will automatically compile the TypeScript to JavaScript and it will give you the .js file.
2. A really nice Add-In we can have for Visual Studio is Web Essentials. In your Visual Studio go to Tools, Extension and Updates, then we can go to Online and download Web Essentials. It’s a very popular and useful extension for Visual Studio and if you don’t have it already have it already, download it and install it to make Visual Studio more powerful. it does all kinds of great stuff with CSS to make it easier to work with colours, work with vendor prefixes, and a lot of web-related activity. It’s actually a very good tool for TypeScript too.
I hope you enjoyed this article. Thank you for reading.
Happy Coding,
Ahamed
Leave a comment