How Do We Get Along With Static Types

9278c3a06b8d8752fb913dea93f959c1?s=47 FUJI Goro
November 13, 2016

How Do We Get Along With Static Types

Tokyo Node Fest 2016 by gfx

9278c3a06b8d8752fb913dea93f959c1?s=128

FUJI Goro

November 13, 2016
Tweet

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!