Upgrade to Pro — share decks privately, control downloads, hide ads and more …

セーフティ・JavaScript・プログラミング

 セーフティ・JavaScript・プログラミング

e_ntyo

May 26, 2018
Tweet

More Decks by e_ntyo

Other Decks in Programming

Transcript

  1. 1. @e_ntyoとは
 • オタク(アイドル, アニメ, バンド) 
 • 走る異常性癖
 •

    普段はTypeScriptを書いている 
 ◦ 最近はHaskell, GraphQLに興味

  2. 2. なぜJavaScriptなのか
 • 活躍する機会が豊富
 ◦ web browser, v8 engine, mobile,

    etc… 
 ▪ メディアプログラミングの環境としても優秀 
 ◦ Webアプリケーション開発における莫大な資産(ドキュメント, ライブラリ, FW, 知見) 
 • 特になし

  3. 2. なぜJavaScriptなのか
 • そもそも出来ることならJavaScriptなんて書きたくない
 ◦ AltJSを使おう(後述) 
 ◦ もうすぐwasmの時代がやってくるらしい 


    • それでも今は、書かなくてはならない
 ◦ 今、本格的なWebアプリケーションを開発・運用するなら、JSからは逃げられない 
 ▪ 既存の手法を利用し、早く作って早く公開する必要に駆られることは多い 
 ◦ あなたの大好きなプログラミング言語のコードを読める人は会社に何人いるか 

  4. 3. 何をもって”安全”とするのか
 • プログラミング言語の文脈での”安全”
 ◦ メモリ安全性, 型安全性, null安全, etc…
 ◦

    使うプログラミング言語に依存するところが大きい 
 • “安全な言語とはプログラミングの最中にうっかり自分の足を撃つことが不可能 な言語”
 - Benjamin C. Pierce 著/住井英二郎 監訳/遠藤侑介・酒井政裕・今井敬吾・黒木裕介・今井宜洋・才川隆文・今井健男 訳 
 『型システム入門 プログラミング言語と型の理論』 (オーム社、978-4-274-06911-6、2013年) 
 ◦ うっかり”危険”な操作をしないよう、適切な抽象を提供する 
 ▪ スコープ違反
 ▪ nullを含む型エラー
 ▪ セグメント違反, 配列の無効なアクセス 

  5. 3. 何をもって”安全”とするのか
 • 型安全 != 実行前に危険な/誤った箇所がわかる
 ◦ 実行時にエラーで教えてくれるタイプ == 動的型付け言語

    
 ◦ 環境(使用する言語やツール)に依存 
 ◦ 静的型の表現力にも限界はある 
 ▪ どこまで実行前にチェックするか 
 ▪ 依存型やモナドで表現力を高めていく 
 • 今回扱う”安全”は、”TypeScriptで担保される安全”`

  6. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…
 TypeScriptでこれらの”危険”は回避できるのか? 

  7. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…

  8. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…

  9. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…

  10. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…

  11. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…
 transpile

  12. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…

  13. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…

  14. 4. 安全にJavaScript を書くために
 • JavaScriptでの”危険”とは何か
 ◦ Null, undefinedの扱い 
 ◦

    等価性判定
 ◦ var, letで宣言した変数への 
 再代入
 ◦ 存在しないプロパティへの 
 アクセス・代入
 ◦ etc…
 • with, eval
 ◦ やめようね!
 ◦ neverを使うとマシに 
 • dead code
 ◦ 論理的に到達不可能なコードは 
 検出される
 • if, switchの条件分岐の漏れ 
 ◦ if, caseブロック内で 
 値を返す関数の場合、 
 それは網羅的でないといけない 
 ▪ もちろん検出される

  15. 4. 安全にJavaScriptを書くために
 • でもお高いんでしょう?
 ◦ “Your TypeScript is JavaScript” 


    ▪ 既存のJSのコードをそのままtscを噛ませると、エラーが出ても必ず出力される 
 ▪ TSの導入にコストはかからない 
 • 安全性以外の特典
 ◦ 型がコードのドキュメントのようにはたらく 
 ◦ 最新のECMAScriptの機能が使える 
 ▪ babelいらず
 ◦ 既存のたくさんのJSライブラリの型ヒント 
 ▪ 補完だけ欲しい人にも 

  16. 4. 安全にJavaScriptを書くために
 • さらに”安全”にやっていくために
 ◦ 副作用のないコード 
 ▪ いちいち関数の返した値を変数に束縛したくない 


    ◦ テスタブルで再利用性の高いコード 
 ▪ well-testedな関数の組み合わせで書けばバグりにくいはず 
 ◦ 文脈を型で表現したい 
 ▪ Option<T>くんはどこ…? 

  17. 4. 安全にJavaScriptを書くために
 • さらに”安全”にやっていくために
 ◦ 副作用のないコード 
 ▪ いちいち関数の返した値を変数に束縛したくない 


    ◦ テスタブルで再利用性の高いコード 
 ▪ well-testedな関数の組み合わせで書けばバグりにくいはず 
 ◦ 文脈を型で表現したい 
 ▪ Option<T>くんはどこ…? 

  18. 4. 安全にJavaScriptを書くために
 • いつものパターン
 ◦ fp
 ▪ むやみにグローバルな状態を作らない 
 ▪

    副作用を出さない
 • ケースによってはReactive Extensionsもアリかと 
 ▪ 複雑な機能はwell-testedな小さな関数の組み合わせで実現 
 ▪ カリー化
 ▪ 高階関数
 ▪ 関数合成
 ▪ オライリーから本が出ているが古い 
 • Webのドキュメントを漁ったほうが良い 

  19. 4. 安全にJavaScriptを書くために
 • gcanti/fp-ts
 ◦ 最近出てきたさいつよモナドライブラリ 
 ▪ さいつよ: Star,

    機能数, 更新頻度 
 ◦ PureScript, fantasy-land, static-land, Scalaにインスパイアされた
 ◦ 最新のTypeScriptの機能を取り入れている
 ◦ interfaceで高階型を表現し、Applicative, Monadを提供
 ◦ Option<T>, Either<T>, Reader<T>, Writer<T>, State<T>, Task<T>, Debug.Trace(), etc…
 ◦ この前記事を書いたので読んでください