OCamlでJavaScriptが幸せ

BuckleScript + Reason

Transcript

1. OCamlでJavaScriptが幸せ
   

   View Slide

2. .｡oO(さっちゃんですよヾ(〃l _ l)ﾉﾞ☆)
   

   View Slide

3. Lisp知ってますか?
   (defun fact (n)
   (if (= n 0)
   1
   (* n (fact (- n 1))) ) )
   (format t "~A" (fact 42))
   

   View Slide

4. Lisp
   = (型無し)λ + macro
   

   View Slide

5. Lisp
   = JavaScript + macro
   

   View Slide

6. λ ≒ 値としての函數 (を表はす記法)
   let callback = (err, data) => {
   if (err) { throw err; }
   console.log(data);
   };
   fs.readSync(ʻmomongaʼ, ʻutf8ʼ, callback);
   

   View Slide

7. 型無しλには型が無い
   

   View Slide

8. 型?
   型 = 値の分類
   

   View Slide

9. 型?
   命題P(x) : xは美味しい
   「美味しいもの」は型Pを持つ。
   

   View Slide

10. 型?
    型が在り、型の演算が出來れば、
    計算を検証出來る。
    

    View Slide

11. 命題f : 美味しいものは今⽇の⼣⾷になる
    命題g : トマトは美味しい
    ⇒ 命題h : トマトは今⽇の⼣⾷になる
    

    View Slide

12. 型P : 美味しいもの
    型Q : 今⽇の⼣⾷
    型R : トマト
    函數f : P→Q
    函數ｇ : R→P
    ⇒ f・g = 函數h : R→Qが作れる
    

    View Slide

13. Lisp + 型 → ML
    

    View Slide

14. Lisp + 型 + OOP → OCaml
    

    View Slide

15. OCaml
    正格な型の割りと純粋な函數型⾔語
    ⾦融系や原發その他で實績が在る
    

    View Slide

16. JavaScript
    型は餘んまり無い
    第⼀級函數
    モジュールでプログラムを區
    切る
    ちょっとしたOOP
    正格 & 先⾏評價
    mutable (時々immutable)
    OCaml
    (実⾏時には)型は餘んまり無い
    第⼀級函數
    モジュールでプログラムを區切
    る
    ちょっとしたOOP
    正格 & 先⾏評價
    immutable (時々mutable)
    

    View Slide

17. JavaScript
    型は餘んまり無い
    第⼀級函數
    モジュールでプログラムを區
    切る
    ちょっとしたOOP
    正格 & 先⾏評價
    mutable (時々immutable)
    OCaml
    (実⾏時には)型は餘んまり無い
    第⼀級函數
    モジュールでプログラムを區切
    る
    ちょっとしたOOP
    正格 & 先⾏評價
    immutable (時々mutable)
    

    View Slide

18. JavaScript
    型は餘んまり無い
    第⼀級函數
    モジュールでプログラムを區
    切る
    ちょっとしたOOP
    正格 & 先⾏評價
    mutable (時々immutable)
    OCaml
    (実⾏時には)型は餘んまり無い
    第⼀級函數
    モジュールでプログラムを區切
    る
    ちょっとしたOOP
    正格 & 先⾏評價
    immutable (時々mutable)
    /|
    ﾍ /|/ | N /i/´ ﾞ￣￣｀`ヾ)＿ ∧ /
    V .| , Nヾ ﾞ ﾞヽ |＼/ ∨l/
    ﾚ‘ 7Nﾞ､ ﾞi _|｀
    JS /Nﾞゞ .! ヽ O
    だ 7ゞミﾐ､ ノ,彡ｲﾊヾ、 i Z C
    っ Zー-r-==､’リノ_ﾉ_,.ヾミ,.ｨ,ﾆi ヽ a
    た / {i ｀ﾞ‘;l={ﾞ´石ゞ}=’´ﾞ‘r_/ 〈 m
    ん |: ｀iー’/ ヾ､__,.ﾉ /i´ / l
    だ i､ ! ﾞﾆ-=､ u / ,ト, ∠_ は
    よ |｀ ヽ、I‘､_丿 ／／/ ヽ /_
    ！！ | ＿,.ｨﾍヽ二 ｨ'_／ / ﾞi＼|／Wlﾍ
    |'￣／ i ヽ_.／´ ./ .| ｀＼ ∨＼
    wﾍ /＼|／ /ィ´￣ﾞi / ir＝､ l'i"ヽ､
    ∨ ∠__,,..-ｲ i /＼_,ｲ,=-、 i ､,.ゞ､ | ﾞ'"ヽ ＼
    ! .i-'´ ,i | ./｀ﾞ'i' /i_.!._,..ヽ＜! ﾞi､ﾞi. =ﾞ! ＼
    ! | .,iﾞ::|/ .| ,/::/-i ﾞi ﾞi 三ﾞi ﾞi | /⌒
    i/ .| ,iﾞ:::i' | ,/ ::/= .|三. ﾞi/.| .| .| .ij:.
    .l〉 | ,iﾞ :::| .!' ::::iﾞ'i ﾄ. ﾞi | _,.. V ＝,!
    ! | ,iﾞ ::::| / ::::::| l= ヾ!.._ ヽ｣ "´;i :.:i ./
    . | .| .,i ::::::| ,/::::::::::| ヾ:.:. ヾ::" ﾞ /／
    │ | ,i::::::::| ,/ .::::::::: | ﾞi.:.:.:.:.:､:.:.:.:.:.:.:.:.:.:／,ｨ'"´
    .| | i::::::::,ｲ::::::::::::::::| /ﾄ､;:;:;:;:;:;:;:;:;:;::,ノi|Y
    

    View Slide

19. bloomberg/BuckleScript
    

    View Slide

20. *.ml
    → [BuckleScript] → *.js
    

    View Slide

21. let f x y = x + y
    function f(x, y) {
    return x + y | 0;
    }
    

    View Slide

22. class c =
    object (self)
    val p = 19
    method f v = v * p
    end
    let i = new c;;
    Js.log (i#f 3)
    function c_init($$class) {
    var ids =
    CamlinternalOO.new_methods_variables($$class,
    shared, ["p"]);
    var f = ids[0];
    var p = ids[1];
    CamlinternalOO.set_method($$class, f, function
    (self$neg1, v) {
    return Caml_int32.imul(v, self$neg1[p]);
    });
    return function (_, self) {
    var self$1 =
    CamlinternalOO.create_object_opt(self, $$class);
    self$1[p] = 19;
    return self$1;
    };
    }
    var c = CamlinternalOO.make_class(shared, c_init);
    var i = Curry._1(c[0], 0);
    console.log(Curry.js2(102, 1, i, 3));
    

    View Slide

23. facebook/Reason
    

    View Slide

24. Reason
    type component = {displayName: string};
    let module Sibling = {
    let createElement (children: list component) => {displayName: "t Sibling"};
    };
    let module Momonga = {
    let createElement a::a=? b::b=? children => {displayName: "t Momonga "};
    };
    let div argument1::argument1=? children => {
    displayName: "test”;
    };
    Js.log
    
    
    ;
    ;
    

    View Slide

25. Reason
    ≒ OCaml + JSX
    

    View Slide

26. *.re
    → [Reason] → AST
    → [BuckleScript] → *.js
    

    View Slide

27. OCaml v.s. TypeScript
    TypeScript < OCaml
    ∴ OCaml
    

    View Slide

28. OCaml v.s. Flow
    Flow < OCaml
    ∴ OCaml
    

    View Slide

29. OCaml v.s. Haxe
    Haxe ≠ OCaml = JavaScript
    ∴ OCaml
    

    View Slide

30. OCaml v.s. Haste
    Haste = Haskell ≠ JavaScript
    ∴ OCaml
    

    View Slide

31. OCaml v.s. Elm
    Elm ≒ OCaml + FRP
    Elm ≠ JavaScript
    ∴ OCaml
    

    View Slide

32. OCamlで幸せ
    

    View Slide