DEV Community 👩‍💻👨‍💻

Cover image for Basics of Typescript
Shreyas Pahune
Shreyas Pahune

Posted on • Updated on

Basics of Typescript

Hey developers in today's blog we are going to learn about the basics of typescript.

This is going a be a series of blogs in which I'm gonna help you learn TypeScript in an easy way!

We are going to cover

  • What is TypeScript?
  • Why should we use it instead of JavaScript?
  • Pros and Cons of TypeScript.

What is TypeScript?

  • TypeScript is the superset of JavaScript.

  • TypeScript can be used to built enterprise level applications.

  • TypeScript provides:

    • Static Typing
    • Classes
    • Interfaces
    • Unions

    and a ton of amazing things...

Why should you use TS instead of JS?

  • TS will save you from more exceptions and project failures.

    • If we have a function which will add two numbers
  function addNums(a, b){
      return a+b;
  }


  console.log(addNums(10 + '10'))
  // here the output would be 1010
Enter fullscreen mode Exit fullscreen mode

As shown in the above example... this code is valid and it will run perfectly but it does not give the expected output.

These sort of silly failures are prevented by typescript.

The code in TS would be

  function addNums(a:number, b:number){
      return a+b
  }

  console.log(addNums(10 + 10)) // output: 20
  console.log(addNums(10 + '10')) // output: this would give an error (argument of type string isn't assignable to string)
Enter fullscreen mode Exit fullscreen mode
  • If there is a large code-base and there are lots and lots of variables... so it is natural to not remember many of them. TS has a great integration with the IDE and together they make our coding experience a lot more smooth. There are many benefits like :

    • Hover Support

hoverIMG

  • Code auto completion

    • With static typed languages the auto complete is better and faster.
  • Type checking in real time

    • In JS we can access the property of an object which does not exists and it will just return undefined but in TS it will show an error that the property you are trying to access is not present.
  • Easier Code Factoring

Advantages/Pros of TypeScript

  • Steep learning curve
    • You don't have to learn a whole new language as all those features which you are used to in JS are primarily used in TS also.
  • Spotting bugs is relatively easy
    • According to a research 15% of bugs are found at the compile stage
  • Readability
    • The code becomes more self expressive due to the types.
    • The code speaks for itself which helps a lot when working with big teams.
  • Follows OOP paradigm
    • The concepts of OOPs like classes, inheritance and interfaces can be used in TS.
  • Huge Community
    • As per reports TS was the second most loved language of 2020.
    • There are lots of developers and a great community out there which works on TS and it is also maintained by Microsoft.

Disadvantage/Cons of TypeScript

  • TS has to be compiled as the browsers don't understand it.
  • Long TS codes might take some time to compile.

This was just the basics of typescript and in the next blog I'm gonna explain how to code in typescript (Basic data types, Arrays, Tuples, Union, Interfaces, Types and many more fun stuff!!)

Thank you so much for reading the whole blog and please share your feedback in the comment section.

Top comments (2)

Collapse
 
leonardoromero profile image
Leo Romero

Very useful, thanks!

Collapse
 
shreyazz profile image
Shreyas Pahune Author

Thanks for reading 😃

What image format should you use in your next project? 🤔