Elmのシグナルについて
Elmのシグナルについて、よくわからないかんじなのでメモ。
情報源はここ。
シグナルって?
wikipediaによると、時間に従って変化する値、とある。例えばElmでは、ある時間、ある時間でのマウスの位置を保持したものをMouse.positionとして取得することができる。これがシグナルの例。
どうやって使うの?
mapすることによってシグナルの値に触ることができる。例えば、
import Graphics.Element exposing(..) import Signal exposing(..) import Mouse main = show Mouse.x
としても、Elmはhtml上に、"Signal" としか表示させることができない。Signalの中にはMouse.xの値が詰まっているはずだ。そこで、以下のようにする。
import Graphics.Element exposing(..) import Signal exposing(..) import Mouse main = map show Mouse.x
これで、マウスのx軸の値をリアルタイムでブラウザ上に反映させるhtmlを作成することができる。
にょろにょろ(<~)(~)の意味がわからないんだけど?
どちらもmap。
(<~)については、
import Graphics.Element exposing(..) import Signal exposing(..) import Mouse main = show <~ Mouse.x -- map show Mouse.x と同じ!
ということで、普通のmapと同じ。ただmapを中置演算子にしただけなので、
main = show `map` Mouse.x
とイコールということになる。
(~)については、map2, map3, ...と同じ。
map2とはなにかというと、
import Graphics.Element exposing(..) import Signal exposing(..) import Mouse xySignal : Signal (Int, Int) xySignal = map2 (,) Mouse.x Mouse.y main = show <~ xySignal
2つのシグナルの値を一気に取り出して、関数に適用することができるもの。これを(~)を使うと、
import Graphics.Element exposing(..) import Signal exposing(..) import Mouse xySignal : Signal (Int, Int) xySignal = (,) <~ Mouse.x ~ Mouse.y main = show <~ xySignal
と書ける。
おわりに
2つのにょろにょろ(<~) (~)を理解するのにも、非常に時間がかかってしまった。Elm道は長い...