きるこの日記帳

なぜElm

Yew（Rust + wasm のフレームワーク）が昨年出たので使ってみたかった。

Elmとは

純粋関数型の言語にあたる。
Haskell を連想させるけど、JavaScript として吐き出され、モナドがなくて、学習が楽だという。
Haskell を使ったことがないので、お察しください。

Elmの特徴

型、値

静的型付けで、型アノテーションをつけることによって定義する。
また、全ての値は Immutable となる。

関数

無名関数、名前付き関数の 2 種類が存在する。

\x -> x + 1

\x y -> x + y

add1 : Int -> Int
add1 x =
  x + 1

定数は、引数のない関数となる。

name =
  "Sam"

関数の適用は、左結合となる。
チュートリアルの例として、divide という関数がある。

divide : Float -> Float -> Float
divide x y =
    x / y

引数に 5,2 を指定する場合

divide 5 2

となる。
この関数は次のように評価される。

((divide 5) 2)

まず divide 5 が評価され、5 / y の結果を返すような中間的な関数となる。
その中間的な関数の y に、divide の第 2 引数を渡して結果が算出される。

divide5 : Float -> Float
divide5 y =
  5 / y

divide5 2

-- 2.5

全ての関数は 1 つの引数を受け取り、1 つの結果を返す。
したがって以下のコードのように、引数が 1 つでも、部分的に適用された関数が返る。

add : Int -> Int -> Int
add x y =
  x + y

add2 = add 2　　-- ※2が返る
add2 3 -- 結果は5

引数に関数を指定する場合は、括弧でグループ化する。

add 1 (divide 12 3)

パイプ演算子がある。

records
    |> map getCost
    |> filter (isOver 100)
    |> sum

正格評価

Haskell のような遅延評価ではない

インデント

半角スペース 4 に規定されている。

最初のチュートリアル

Elmのチュートリアルをちょっとやる。 インストールは省略。

hello.elm を作成する。

module Hello exposing (..)

import Html exposing (text)


main =
    text "Hello"

まずモジュール宣言をする。
原則はファイル名と同じ名前なので、モジュール名は Hello となる。

module Hello exposing (..)

次に、HTML モジュールを読み込む。
その名の通り、HTML を扱うモジュールで、仮想 DOM を採用している。

import Html exposing (text)

exposing で引数に関数名または型を指定すると、それを expose する。

import Html exposing (..)

と、引数を .. にすることで HTML モジュール全ての関数（と型）を使用できるが、推奨されていない。

Elm は実行時に main 関数を起動する。
また、main 関数はページに描画する結果を返す関数となる。
そのため main を実行。

main =
    text "Hello"

上のコードではさらに、ブロック内で、HTML から expose した text 関数を実行している。
text 関数の"Hello"が返り、ビルド時に HTML として出力される。

実行

elm reactor コマンドで、サーバーを立てることができる。

$ elm reactor

ビルド

$ elm make --output hello.html

続く。

参考

Elmのチュートリアル
プログラミング言語Elmの薄い本
Elm 言語 が楽しすぎたので Typetalk のクライアントアプリを作りました。 | ヌーラボ