フロントエンドデベロッパーのメモ

スキル: HTML/Jade/Jinja2, CSS/SCSS, JavaScript(ES6), Angular, React,Next, Redux, Node, Express, Python, Flask, Postgres, Redis, MongoDB, Kafka, Knex, SQLAlchemy, React Native, EXPO, GraphQL/Apollo, REST, AWS, Heroku, Docker, CircleCI, SCRUM, XP, Vim, TDD

Observableってなに?in JS

最近ReduxのソースコードやMobXのドキュメントを読んでると当然のようにObersevableというキーワードを見かけるようになったのでObservableとはなんぞやということで少し調べてみました。少しだけ調べた結果から言うと、ES7(ES2016)のシンタックスとして追加されると言われていたりObersevableはAPIなのでシンタックスとしては追加されないなど余計にややこしくなりました。と言うことで、公式プロポを確認した結果ありました。こちらにスタンダードライブラリとして紹介されています。

github.com

ちなみにさっきのリンク読めば書いてるんですけど、Observableのライブラリは他にも3つあります。 個人的に一番とっつきやすいのかなと思ったのは、 https://github.com/staltz/xstream

王道は行くなら https://github.com/ReactiveX/RxJS

こちらは、プロポの共著者の方が書いてるらしいですね。 https://github.com/zenparsing/zen-observable

どれが良いかと言われると正直決めかねますから、どれも使いこなせると一番良いのかもしれません笑 ただ基本的なコンセプトは同じなのでどれか一つやっておけば、ここで紹介した他のライブラリをチーム内で使用することになってもすぐ適応できるはずです。

ところで、Observableを作った理由ですがドキュメントによると、

ユーザーによるDOMイベントが発生した時(例えばボタンがクリックされたなど)にストリーム処理をプラットフォーム内やアプリケーション内で共有することができます。なぜこんなことをする必要があるのかと言うとJavaScriptのそれぞれのライブラリやフレームワーク間で使用しているキーワードが被ってしまい、想定していなかったイベントが起こってしまうといった不都合が起こってしまうためです。

具体的な使用例については後日改めて記載したいと思います。