How Do We Get Along With Static Types

Transcript

1. How Do We Get Along With Static Types Lightning Talk

   by @__gfx__ Tokyo Node Fest 2016, 2016/11/13, Markcity
2. None

3. My Activities on JavaScript 2012: Developed DeNA JSX (jsx.github.io) 2016:

   bitjourney/ci-npm-update in TypeScript 2016: Try to introduce TypeScript to an webservice, but resulted in failure TypeScript+React/JSX is just an ealy stage

4. Q: Do you use static-typed altJS in production?

5. My Answer: Not Yet

6. Static Typed altJS TypeScript (TS) Flowtype (Flow) Dart, Haxe, Kotlin,

   and so on

7. For Example: TypeScript

8. TypeScript Lead by Microsoft First-class support in Visual Studio Code

   Modern Static Typing Support Facebook JSX and ES2017 async & await

9. TypeScript Syntax: ES2017 + type annotations class Pair<F, S> {

   first: F; second: S; constructor(first: F, second: S) { this.first = first; this.second = second; } } console.log(new Pair("foo", 10));

10. TypeScript Static Typing = A system that analizes program ow

    and validate its semantics i.e. kind of "Powerful Lint" function multiply(a: number, b: number) { return a * b; } console.log(multiply("a", "b")); // Error! // Argument of type '"a"' is not assignable // to parameter of type 'number'. console.log(multiply(2, 3).length); // Error! // Property 'length' does not exist on type 'number'.

11. TypeScript In TS and Flow: Type ≒ Set of Values

    // name must be "foo" or "bar" function f(name: "foo" | "bar") { console.log(name); } console.log(f("foo")); console.log(f("FOO")); // Error! Event names in addEventListener() Nullable type is represented in string | null

12. So as Flowtype $ flow f.flow.js f.flow.js:8 8: f("FOO"); ^^^^^^^^

    function call 8: f("FOO"); ^^^^^ string. This type is incompatible with 3: function f(name: "foo" | "bar") { ^^^^^^^^^^^^^ string enum Found 1 error

13. And More

14. TypeScript The toolkit incudes auto completion service:

15. Flowtype Flowtype is also considered as "powerful lint" owtype.org says

    "a static type checker for JavaScript" auto completion ready: flow autocomplete

16. Cons.

17. Dif culty of using JavaScript assets

18. How Flowtype uses JS assets Flow is a JavaScript extension

    and thus can import ".js" les as owtype scripts (!) flow suggest $jsfile generates a patch to add type annotations to the speci ed pure JavaScript code ow-typed: the type de nition registry for Flow However, ow-typed does not cover all the libraries of the world :(

19. How owtype uses JS assets TypeScript requres type de nition

    les (".d.ts") require('foo.js') is possible but returns any :( De nitelyTyped: the type de nition registry for TypeScript However, De nitelyTyped does not cover all the libraries of the world :(

20. How Dart uses JS assets Dart requires type de nitions

    source_gen , like Java annotation processor, generates source code in compile time dts2dart: a tool to convert ".d.ts" to Dart type de nitions Migration to Dart is too dif cult because Dart is very different from JavaScript

21. Dif culty of Static Typing Do you know the return

    type of the promise ? class Promise<T> { static resolve(T value): Promise<T>; static resolve(): Promise<void>; } const promise = (isX() ? Promise.resolve("foo") : Promise.resolve());

22. The Answer in tsc v2.1.1 promise is: Promise<string> | Promise<void>

    not: Promise<string | void> nor: Promise<void>

23. The Answer in ow v0.35.0 promise is: Promise<string | void>

24. Okey, how can I use static- typed altJS nowadays?

25. Flowtype is acceptable IMO: Extending ".js" les is a bad

    idea :( but TypeScript is too dif cult to use in production because of missing type de nitions If TypeScript compiler supported plugins to hook reading script les, it would can read pure JavaScript and/or Flowtype source les. power-assert transpiler could also be implemented as a tsc plugin

26. The Future I have a dream that there's the standard

    of static- typed JavaScript, based on Flowtype and TypeScript It's not just a dream because the syntaxes of Flow and TS are very alike Not neseccarily an internaltional standard, but a standard made by cooperation of Microsoft and Facebook I HOPE IT, REALLY

27. Thank you!