始めようElmでフロント開発_その01_Elmの基礎

社内勉強会資料

Transcript

1.  Elm    01
   Elm 
   
2. "Elm-.Q O EMNA9NB6),32 O    O ! * O 0  O IP>DK@7OCE:PGN?O 6 O # 
   2  '+40%$ (ERS;8B&4) JavaScript1=NC8L/(5  FM<JHN<
3. ! $ ! "*0'-+1'#  /*0'-+1'4 2 %+,3()/ 2   /   2 
    2 &.3 etc 2  
4. 0 npm!*/d 0 ------------------- Elm  /#%1-  /#%1,1  
   Elm Guide /#%1-)1" /#%1,1DL /#%1- https://guide.elm-lang.jp/install.html Elm Guide : !*/&(./(%(Win)/$1+'-(mac) elm !*/&
5. /Elm"0, / elm install Elm'!0.$0, / elm reactor -0,0& 
   .',& &#$ / elm make Elm)-$.', / elm repl . +#(*0%elm 
6. 4Elm7FNQ8 MAL5 " I; >>GL5elmV@T ")$V ?M@6 .K elm repl V?F5
   %J!+?FNT>HV9@@O?M@6 BK1K7<E:K d replJL5 /L5:I76 d ('JT L5'J5` ¥`(Z_eZ + ][WZa[Y`)V=T6 d / KUJ<5 `:` (Xbc) :RMTBKK V# J#?CPK6 ElmL52 ;*,IKG5?D:SH V-@TGP5A<Q8J@TH&76 > 05←KI3K `>` L5replK^bc^\H@T6
7. 
    > "FizzBuzz" : String  : String > 1 : Int > 1.0 : Float 
   : Int, Float > True : Bool > False : Bool   : Bool > [1.0, 2.0, 3] : List Float > ["Fizz", "Buzz"] : List String  : List a > (True, 1.0) : (Bool, Float) > (1, "FizzBuzz", 1.0) : (Int, String, Float)   : (a, b, …) > { name = "sato", age = 28, point = 3.5} : {name : String, age : Int, point : Float}  : {key1 : a, key2 : b, …}
8. C > [] [] : List a C 4B@A? (.8;0 *4 51#2-.";,=#$D List/!;'05 (.";% 4 5 (."2"+9 4 a %!.%><."; '4 a ? 06 '4 a 35$4 %; 3% (+3 ); C
   & > 1 1 : number / ? (+ 40-+/52",=#$D /!;'05 (.";% Int$Float$ (."2"+9 4  number %!.%><."; '4 number 43$(:4
   &4 ? 
   & 06 '4 number 35Int 7+5Float4 %; 3% (+3 );
9. F4/' let a = 2 b = 3.5 in (a * n) / b $ 0 3!25% let-in:( Elm45%;ABG>@D(   )240% 1"9-1 6% 1"9-%1"(& F4 let0+/5% F .4let F ,8in4 0470)8& F24 a : Int a = 2 b : Float b = 3.5 a : Int a = 4
   #43:*1… =E?;D<CGH
10.      > 1 + 2 3 : Int > 1 - 2 -1 : Int > 1 * 2 2 : Int > 1 / 2 0.5 : Float  &   
    Basics https://package.elm-lang.org/packages/elm/core/latest/Basics > 1 // 2 0 : Int    > 1 < 2 True : Bool > 1 <= 2 False : Bool > 1 == 2 False : Bool > 1 /= 2 True : Bool > 1 > 2 False : Bool > 1 >= 2 False : Bool > "abc" ++ "xyz" "abcxyz" : String > 1 :: [2, 3] [1, 2, 3] : List Int
11. N$ qpVolume : Float -> Float -> Float -> Float qpVolume w d h = (1 / 3) * w * d * h N$ $89% 1 -> 2 -> … -> = 5'(76>& 8 8*=8 = =9P28< 5'(89%9% ),.(613>0,…!9%"IOD: > qpVolume 2 3 4 8 : Float N$8 (BOM) @EIOE =4%;3-& #849% .?/?@EIOE4 13;>& >(¥ a b -> a * b) 10 2 20 : Int NLJF$
    6 $(LJF$)@4+>& ¥9%HGAELGCK
12. 5 if a == 0 then "ABC" else if a == 1 then "HIJ" else "XYZ" 5if 5case case (a, b) of (0, 0) -> "A" (0, _) -> "B" (_, _) -> "C" _ -> "D"   /)641,+ # $ `_` (&4*6.6)!3'2-(6- 5for, while  260 !  
    %" 
13.   fib : Int -> Int fib n = case n of 1 -> 1 2 -> 1 _ -> fib (n - 1) + fib (n - 2)   (
    ) toString : List Int -> String toString list = List.map (¥ i -> String.fromInt i) list map ¥    sum : List Int -> Int sum list = List.foldl (+) list foldl pickPositive : List Int -> List Int pickPositive list = List.filter (¥ i -> 0 < i ) list filter ¥   
14. ) 
     type alias User = { name : String , age : Int , point : Float } )&#'$#("%() User       > u1 = User "sato" 28 3.5     evaluate : User -> Float evaluate user = abs(2.5 - toFloat(user.age // 10)) * user.point !… > u1 = { name = "sato", age = 28, point = 3.5} evaluate : { name : String , age : Int , point : Float } -> Float evaluate user = abs(2.5 - toFloat(user.age // 10)) * user.point  …  …
15. 9!
    ) type UserType = Employee | Guest 9.0161-5 UserType"! Employee"Guest )'$#) ($ type alias User = { name : String , age : Int , point : Float , usertype : UserType } > u1 = User "sato" 28 3.5 Employee type alias UserInfo = { name : String , age : Int , point : Float } type User = Employee UserInfo | Guest UserInfo "'$ %+ 2:1" & !) *$' … case user of Employee info -> --  Guest info -> -- /03 " $!) %Employee"Guest+47,83"
16.  )-(0 .   !Basics*'+/, %$ ( :https://package.elm-lang.org/packages/elm/core/latest/Basics) .Int &  $!String.fromInt&
     ( :https://package.elm-lang.org/packages/elm/core/latest/String) fizzbuzz&"#
17. fizzbuzz : Int -> String fizzbuzz n = case (modBy 3 n, modBy 5 n) of ( 0, 0 ) -> "FizzBuzz" ( 0, _ ) -> "Fizz" ( _, 0 ) -> "Buzz" _ -> String.fromInt n 
    fizzbuzz : Int -> String fizzbuzz n = let toStr b str = case modBy b n of 0 -> str _ -> "" fbStr = (toStr 3 "Fizz") ++ (toStr 5 "Buzz") in if fbStr == "" then String.fromInt n else fbStr fizzbuzzList : Int -> List String fizzbuzzList n = List.map fizzbuzz <| List.range 1 n 
    
    
18.  :;</3  2 2 9 =,$2 .62 96 9* 9* !/*7'/ qpVolume : Float -> Float -> Float -> Float #&
    3 /0+-"7$ qpVolume : Float -> (Float -> Float -> Float) /7'/$:;< Elm3-2 3:;<(8-"7 5+- 3 qpVolume : Float -> (Float -> (Float -> Float)) /(81(8-"% ,46Elm3 =,2 9&6=,2 9* )# )0" '89
19.   "  ! ! 
    ! !# % '() &$ qpVolume : Float -> Float -> Float -> Float qpVolume w d h = (1 / 3) * w * d * h   qpVolume_w5 : Float -> Float -> Float qpVolume_w5 = qpVolume 5 > qpVolume 5 4 3 20 : Float > qpVolume_w5 4 3 20 : Float % %
20. 
     $ Elm% $ "%! "#  $ Html %! $ MVC etc …
21. 
        Elm