Type-safety in JavaScript!

Really ?

Inspired by : Type Safety for JavaScript by Ben Weber (Department of Computer Science, University of California)

JS101 - Data Types

• String
• Number
• Boolean
• Object (RegExp, Array, Null, Function et.all)
• Undefined

What is Type safety?

Type safety means that the compiler will validate types, and throw an error if you try to assign the wrong type to a variable.

source : what is type safety? (language agnostic)

Agenda

1. Vulnerabilities with loose typing
2. Viable options for Type Safety in JS
3. TypeScript or FlowType ?
4. Demo of a sample application

Vulnerabilities with loose typing

• Applying an arithmetic operator

  • "5" - "3" = 2
    

  • "5" + "3" = "53"

• Accessing a non-existent variable
• Accessing a property of a null object

let greatestCommonDivisor = ( n, m ) =>
    n === m 
        ? n 
	: n < m 
            ? greatestCommonDivisor( n, m – n ) 
	    : greatestCommonDivisor( n - m, n ); 

greatestCommonDivisor( “9”, “24” )    

// output 
// Uncaught RangeError: Maximum call stack size exceeded

let greatestCommonDivisor = ( n, m ) => {

    n = Math.abs( parseInt( n, 10 ) ); 
    m = Math.abs( parseInt( m, 10 ) ); 

    return isNaN( n ) || isNaN( m ) 
        ? NaN 
        : n === m 
            ? n 
            : n < m 
                ? greatestCommonDivisor( n, m - n ) 
                : greatestCommonDivisor( n - m, n ); 

}

The Horror

Viable Options

• Static Typing

• Type Inference

Static Typing

• Data type is known at compile time
• Specifies possible states of an Object
• Done using code annotations

Class Person implements t1 {
    subordinate : t1;
    constructor ( x : number ) {
 	this.money = x; 
    }
    employPerson( y : t1, ) : void { 
	this.subordinate = y;
    }
} 

t1 john = new Person( 10000 ); 
t1 paul = new Person( 1000 ); 

john.employPerson( paul );

Type Inference

• Safety of Static type systems without Type Annotations

• Reducing expressions to implicitly typed values

• Easy to use ; Implementation is difficult

Non-Typed Code

Typed Code

Constraint Satisfaction Algo

TypeScript

• Initially based on Static types, now includes type inference
• Bootstrapped - Written using typescript
• Superset of JS. Uses '.ts'
• Definitely typed -more than 2500 libraries
• Control flow check

FlowType

• Based on Type Inference
• OCaml - Compiles using BuckleScript
• Just a library to check types. Uses '.js'
• Flow Typed - fairly new
• Minimal control flow check

vs

Demo Time

The positives

• Type definitions
• Community
• Bootstrapped

• Live Documentation
• Intellisense 
• Catch bugs early

The deltas

Static Types

Perceived 

Bugs

• Only a subset of bugs are handled
• One more thing to learn or train the team

Your Takeaway Menu

• Type safety is hard
• Handling it will reduce a lot of bugs for large teams or products 
• Live documentation and Intellisense even for most of the popular libraries 
• One more thing to learn

Safely Compile to

JS

Shoot your questions

@sbmadhav

https://github.com/sbmadhav