Typechecking in Javascript using Flow

- What is Typechecking
- Dynamic vs Statically Typed Languages
- Why is typechecking required in Javascript
- Flow Type annotations
- Examples with React https://github.com/tejasbubane/todo_flow

Transcript

1. STATIC TYPECHECKING IN JAVASCRIPT - Tejas Bubane (@tejasbubane)
2. Dynamically Typed vs Statically Typed
3. DYNAMICALLY TYPED ▸ No type definitions to write ▸Throws errors at runtime ▸ e.g. Ruby, Javascript ▸Ease of development, no restrictions ▸ Typechecking at runtime
4. STATICALLY TYPED ▸Types defined explicitly & checked at compile time ▸Catch errors at compile time ▸e.g. Java, Scala, Swift, etc. ▸little overhead of writing types all the time
5. WHY JAVASCRIPT ??? ▸ 1 == “1” => true ▸ true == 1 => true ▸ null == undefined => true ▸ a = 1; b = “1”; a + b; => “11” ▸ this => ???? ▸ typeof NaN => ‘number’ ▸ “1” - “2” => -1 COERCION, GLOBAL VARIABLES, CHANGING SCOPES…..
6. #TRIVIA
7. WHY JAVASCRIPT ?
8. ALTERNATIVES
9. ▸ “Understands” Javascript, ES6 and React code ▸ Type inference ▸ Type “flows” through the code
10. FLOW BASIC TYPES
11. FUNCTIONS
12. UNION TYPES
13. MAYBE TYPES
14. INTERFACES
15. INTERFACES
16. IMPORTING & EXPORTING TYPES
17. EXTERNAL TYPEDEFINITIONS ▸ For external dependencies ▸ https://github.com/flowtype/flow-typed/tree/master/ definitions/npm
18. CODE WALKTHROUGH ▸ React Todo Application using FlowTypes ▸ App demo ▸ Github Code
19. QUESTIONS ??
20. THANK YOU