Introduction

Since its Introduction by Microsoft in 2012, TypeScript has gone ahead to be one of the most popular modern programming languages. Ranked as the seventh(7th) most popular language on StackOverflow in a survey conducted in 2021.

In this article, you'll learn what TypeScript is, How it works behind the scenes, Its unique features and whether or not it's still worth learning in 2023. Let's dive right in!

What Is TypeScript and How Does it Work?

TypeScript is a Compiled and strongly Typed programming language that is a superset of regular JavaScript. It is an open-source language that is Maintained by Microsoft. Does all of that make sense? Well, let's break it down some more.

• What is a Compiled programming language? This is simply a language that needs a compiler to run i.e a language that needs to be converted to machine code for it to be interpreted by the processor. Other examples of such languages are C, C++, Rust etc.

• TypeScript is a strongly typed language, what does this mean? It means that variables and other data structures can be declared to be a specific data type before they are assigned values, hence the name TYPEscript. some examples of data types in typeScript include: string number boolean all any

• TypeScript is a superset of JavaScript: TypeScript is built on the existing JavaScript syntax. It offers all the features of Javascript and an additional feature- Static DataTyping. This is why developers refer to TypeScript as "JavaScript on steroids"

• Typescript is Open Sourced: Microsoft has made it so that anybody can contribute to the development and maintenance of TypeScript. All you need to do is go to it's official GitHub to get started.

TypeScript vs JavaScript

In the previous section, you learned that TypeScript is a superset of JavaScript. It is built on the basic JavaScript syntax, therefore, JavaScript codes will run on TypeScript compilers. The only difference between them, however, is that TypeScript is strongly and statically typed while Javascript is only loosely and dynamically typed. Static typing means that the types are checked and enforced before run time i.e before the code runs in the browser or any other interpreter, In TypeScript static typing integrates the auto-complete feature, it also ensures that bugs and errors are caught during compilation and not during runtime as seen in JavaScript programs, thus giving a more seamless programming experience.

There have questions on whether or not one can start learning TypeScript without basic JavaScript knowledge, the short answer here is, No. Since TypeScript is built on the existing JavaScript syntax, It is only intuitive that basic knowledge of JavaScript will be required to get started with it. As you can tell by now, JavaScript and TypeScript are not exactly in competition with each other.

Below are code snippets that show how similar code blocks are written in both JavaScript and TypeScript.

• Creating variables in Javascript and TypeScript.

    const name= "JavaScript";
  
    let year= 2023;
  
    var updated= true;
  

    const name:string= "Javascript";
  
    let year:number= 2023;
  
    var updated:boolean= true;
  

  You must have noticed, that the only difference between these two sets of codes is the specification of type in TypeScript.

• Creating functions in JavaScript and TypeScript.

    function greeting( name, age ){
    console.log(`Hurray, ${name} is ${age}years old `
    }
  

    function greeting( name:string, age:number ){
    console.log(`Hurray, ${name} is ${age}years old `
    }
  

  Also, notice again how type has been specified for the function parameters. Calling the function with the wrong data type will throw an error in the TypeScript compiler.

Unique Features of TypeScript

In this section, you'll learn some of the unique features of typeScript, just for you to understand why you need it and how it can help you in your projects.

• Static Typing

  You may be wondering why there is so much focus on the concept of type This is because TypeScript was majorly designed to resolve the Data Typing bugs and conflicts that occur in regular Javascript as a result of loose and dynamic data typing. Take, for example, a Javascript object tracks that was created with a couple of key-value pairs as shown in the code base below:

    const tracks={
        artist: "John Doe",
        title: "Come on"
        lenght: 1234
      }
  
    console.log(tracks)
  
    //output: const tracks={
                  artist: "John Doe",
                  title: "Come on"
                  lenght: 1234
                 }
  

  Now, imagine you forgot you used title for the name and instead you call the method tracks.name to change the value of title just before logging tracks to the console, the new output becomes:

     const tracks={
        artist: "John Doe",
        title: "Come on"
        lenght: 1234
      }
     tracks.name="New Title"
     console.log(tracks)
  
    //output: const tracks={
                  artist: "John Doe",
                  title: "Come on",
                  lenght: 1234,
                  name: "New Title"    
                 }
  

  This is not the output you want, a new key-value pair has been added instead of the title change you intended. If this were an object that manages the state of an entire app, this action alone could crash it. These Data typing errors can be resolved easily in Typescript because of its static typing.

• Catching Errors During Code Compilation:

  With TypeScript, errors and bugs such as typos, type errors, uncalled functions etc. are caught before runtime i.e before the code runs in your interpreter e.g in browsers during web development. They are caught during compilation by the TS-compiler. While this may seem like a trivial issue, catching errors only during runtime could lead to serious App breaking errors, especially If you've not done sufficient testing before deployment.

• Disallows Many Type Coercions:

  While the type coercion feature of Javascript has some pros, its use is discouraged as it gives unpredictable results. TypeScript restricts the use of type coercion, For example, TypeScript allows adding a number and a string (resulting in concatenation), but it does not allow the addition of a String and an Object.

• Provides Real-Time autocomplete:

  By checking the type and suggesting properties you may want to use as you write codes, TypeScript helps to autocomplete codes, making writing codes easier. Code Editors such as VScode use TypeScript behind the scenes to suggest and autocomplete in real-time.

• Generation of JavaScript file after Compilation:

  After compilation the TS-compiler generates a JavaScript file that contains a clean and easy-to-read JavaScript version of your TypeScript code which will be interpreted by browsers and other JavaScript interpreters hence, TypeScript can be used for several development processes like Web, Apps etc.

• Makes Refactoring codes easier:

  One of the things developers hate is refactoring an existing code base. With TypeScript this process becomes easier as developers no longer have to guess the data types of variables that have been used in the codes.

Conclusion

In this article, you've learned what TypeScript is and the unique features it ships with. Now to the big question, Is TypeScript still worth learning in 2023?

The answer to this, Yes, It is still worth learning. Not only does it provide solutions to the Typing conflicts seen in JavaScript, but Highly in-demand JavaScript frameworks like Vue, NextJS and Angular are built entirely in TypeScript and also provide first-class TypeScript support. Here is a free online Handbook to get you started with TypeScript: The TypeScript Handbook.

It's a wrap, guys. Like and share this article, also let me know what you think about Typescript in the comment section. Until next time, folks.