Why Typescript?

Why Typescript

Typescript extends JavaScript by adding types at build time.

Benefits

• ✅ Encode constraints and assumptions, as part of developer intent. Defensive programming: Don't trust any of your inputs. Causes cognitive and performance overhead

• ✅ Speeds up your development experience by catching errors and providing fixes even
  before you run your code. Some 15% of JavaScript detectable bugs could be prevented according to a research

• ✅ Easier to refactor code without breaking it significantly. Gives you the confidence to refactor without fear of breaking assumed, implicit contracts.

• ✅ Improved Developer experience: Navigating, understanding complex large size code is easier. Don't need to drill into source files and read all code implementation. You can go one level higher abstraction: rather than how you look at what the code does

• ✅ Helps with documentation. Automated API docs generation. More formalized and stable contracts

Cons

• ❌ Not true static typing, only checks the shape of the object, not its true type.
• ❌ Paradigm shift for developers coming from non statically typed languages, the learning curve
• ❌ Adding extra step — transpiling from .ts files to .js / so many options to consider.

App vs Library concerns

App perspective

• More richness when you work with data. You can discover enumerations you can use, overloads of methods you can call.
• Better encapsulation tools. Private, protected, public, read-only. Unintended code is hidden away from end-user
• Improved "major version upgrade" experience, ie. upgrade from Lodash 3 to 4, you get immediate todo list with all those broken code showing typescript checks.

Library perspective

• Create and maintain public API surface, helps with semantic version guarantees
• Use enums to allow the only type encoded list of values and support for future compatibility, reserve values for future
• SemVer (deprecations, breakage)
• API Docs

Show me some code examples

• casing/typing errors

plain old .js

let toothBrush = { name:'OracleB', price: 2.99 }

function getProductName(product) {
    console.log(product.Name); //simple case error
}

getProductName(toothBrush)  //undefined

type checking .ts

type Product= { name:string, price: number}; //type is defined here..

let toothBrush = { name:'OracleB', price: 2.99 }

function getProductName(product: Product) {
    console.log(product.Name); // !! will fail at development time
}

getProductName(toothBrush)

• undefined is not a function

let myFunction;

myFunction('hello'); //Uncaught type error, not defined..

myFunction = (message)=> console.log(message);

• Accidental type coercion

function addFive(num) {
    return num + 5;
}

let result = addFive('hello') // result = hello5

function addFive(num:number) { ... } // would have fixed this problem in advance.

Myths

It is not going to fix everything, won't fix bad code smells.

❌ No more runtime errors
❌ Code will run faster

Comments

[Lakshya Singh]

alongwith added advantage of better autocompletion by ide's :))