[Elm]getting start Elm language

Elm is a functional language that compiles to JavaScript

GitHub : https://github.com/elm-lang

知ってはいたのですが触っていなかったElm。少しきっかけがあったので触ってみました。
※Elmについて、といった内容はここでは触れません。

この理由としては、チームメンバの1人がSwiftでとある機能を実装している時にこのElm Architectureから構成をインスパイアされたといっていたためです。といっても、Elm Architecture付近をチュートリアルを元に学んでみたというくらい。なので記法を学ぶというよりは、どんな問題を解決しようとどういう設計を行ったか、です。(そういえば、このElm->JSのコンパイラはHaskell製)

試したElmは0.18.0

tutorial(guide): https://guide.elm-lang.org/

tutorialをいくつか実際に動かしたGitHub repository: https://github.com/KazuCocoa/my_first_elm

Elm、実行環境も elm-repl コマンドでターミナル上から簡単に動作みることできるし、 elm-reactor コマンド実行するとローカルホストにブラウザでアクセスするとすぐに動作みることができるので触ってみる障壁がとても低くて感動しました。ドキュメンテーションとか、コミュニティパッケージ群も揃っていました。テストツールとかも、パッケージとしていくつも既に存在しているみたいです。

Elixirをもともと触っていると感じたのですが、なかなかElixirと似通ったものがありました。類似言語に影響を受けているっぽいので文法的なところもなのですが、 One crucial detail here is that commands and subscriptions are data と書いていたり、 Elm treats errors as data とあるように、データの流れを基軸として表現しようとしているところです。

では、かいつまんで。

Architecture

Elmの実装設計パターンは画面の操作を以下のように3つに分割してデータを記述するところ、データを更新するところ、それをViewに反映するところ、で分けるところです。これにより、基本的なボタンをタップするとか、そういうことに対してデータを受け取り、更新し、Viewに反映するという一定の操作を決まった定型文によって区切りながら実装することができるようになっています。

  • Model — the state of your application
  • Update — a way to update your state
  • View — a way to view your state as HTML

これに加え、例えばHTTP通信などの非同期処理などの命令を扱うためにも以下のように2種類の定義も追加されました。( https://guide.elm-lang.org/architecture/effects/ )

  • Commands — A Cmd lets you do stuff: generate a random number, send an HTTP request, etc.
  • Subscriptions — A Sub lets you register that you are interested in something: tell me about location changes, listen for web socket messages, etc.

Elmはこのeffectsの箇所でも以下のように書いている通り、この commandssubscriptions もデータを記述しElmフレームワークに渡すためだけのものとして扱うようです。そこらへんから結果を受け取ってViewに反映させるまでの受け渡しはElm側がみていると。

Aside: One crucial detail here is that commands and subscriptions are data. When you create a command, you do not actually do it. Same with commands in real life. Let’s try it. Eat an entire watermelon in one bite! Did you do it? No! You kept reading before you even thought about buying a tiny watermelon.
Point is, commands and subscriptions are data. You hand them to Elm to actually run them, giving Elm a chance to log all of this information. In the end, effects-as-data means Elm can:
– Have a general purpose time-travel debugger.
– Keep the “same input, same output” guarantee for all Elm functions.
– Avoid setup/teardown phases when testing update logic.
– Cache and batch effects, minimizing HTTP connections or other resources.
So without going too crazy on details, pretty much all the nice guarantees and tools you have in Elm come from the choice to treat effects as data! I think this will make more sense as you get deeper into Elm.
> from https://guide.elm-lang.org/architecture/effects/

あと、エラーハンドリングのところも昨今のnullやexceptionの扱いに関して言及していてよかったです。Erlang/Elixirを触っていると結果はだいたい {:ok, xxx}{:error, xxx} として処理を分けることがほとんどなのですが、そのような感じですね。

実装され、提供されている機能は以下。

  • Maybe
  • Results
  • Task

Null

I call it my billion-dollar mistake. It was the invention of the null reference in 1965. At that time, I was designing the first comprehensive type system for references in an object oriented language (ALGOL W). My goal was to ensure that all use of references should be absolutely safe, with checking performed automatically by the compiler. But I couldn’t resist the temptation to put in a null reference, simply because it was so easy to implement. This has led to innumerable errors, vulnerabilities, and system crashes, which have probably caused a billion dollars of pain and damage in the last forty years.
> 本文より

Exceptions

Joel Spolsky outlined the issues with exceptions pretty nicely in the year 2003. Essentially, code that looks fine may actually crash at runtime. Surprise!

以下なんかをみていると特に、Elixirでいう case ... do ... end の形を思い出します。

締め

1日程度触った感じですが、Elm、なかなかElixirやSwift書いている人にすると比較的学びやすいJS実装な気がします。今後使い続けるかは別にして、関数型言語の領域を学ぶというところでは情報も多すぎず程よいかもしれません。

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s