We Are JavaScripters :) 第5回LT会での発表資料です。

1. immutable-js ことはじめ
K.Matsumura (@zuckey_17)
We are JavaScripters! :)) @5th
2017.03.27

2. 簡単に自己紹介
ファストメディア株式会社 所属
フロントエンドとサーバーサイド
React + Reduxで現行の管理画面をリプレース中
immutable-jsは主にReduxの部分で利用
松村 和輝 (@zuckey_17)

4. （主に）こんな人に向けて話します
• ES6普段書いてるけどもっと安心して書きたい
• Reactとか使ってないんだけど自分に関係あるの？

5. こんなことは話しません
• ES6の文法の細かいところ
• immutableとReact + Reduxとの関係性

6. import
※以降のコードでは省略します

7. fromJS と toJS

8. get と set
ネストしている場合は
第一引数が配列もしくはImmutable.Listでアクセス可能

10. const の罠
• 破壊的なメソッドで変更される
• プロパティへの値の代入は可能
コードが大きくなるとどんどん不安になるので
immutable-jsを使ってそれを防止します

11. Immutable.List

12. Immutable.List

13. Immutable.Map

14. Immutable.Map

15. Immutable.Record
• デフォルト値を表すオブジェクトを引数として
コンストラクタ関数を返す関数
• ’.’ でプロパティにアクセスできる
• setで変更済みの新しいオブジェクトを返す
• デフォルト値で設定した値以外は受け付けない

16. constructorにないプロパティにも値を
入れることができる

18. まとめ
• 名前の通りimmutable(不変)なオブジェクトによって
安心してコーディングができる
• 他にも多くの便利なメソッドがある
• 素のJavaScriptと同じ書き方で違う挙動になることが
あるのでデザイナーの方などに理解を得るのが難し
かったりする

19. ちょっと個人的に宣伝させてください
• 友人とpodcastをはじめました
• “楽しくて仕方がないラジオ”