Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How Do We Get Along With Static Types

November 13, 2016

How Do We Get Along With Static Types

Tokyo Node Fest 2016 by gfx


November 13, 2016

More Decks by FUJI Goro

Other Decks in Technology


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

    by @__gfx__ Tokyo Node Fest 2016, 2016/11/13, Markcity
  2. 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
  3. TypeScript Lead by Microsoft First-class support in Visual Studio Code

    Modern Static Typing Support Facebook JSX and ES2017 async & await
  4. 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));
  5. 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'.
  6. 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
  7. 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
  8. Flowtype Flowtype is also considered as "powerful lint" owtype.org says

    "a static type checker for JavaScript" auto completion ready: flow autocomplete
  9. 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 :(
  10. 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 :(
  11. 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
  12. 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());
  13. The Answer in tsc v2.1.1 promise is: Promise<string> | Promise<void>

    not: Promise<string | void> nor: Promise<void>
  14. 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
  15. 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