altJS勉強会「Haxeすごいからみんな使え！」

尾野政樹
ゲームとか作ったりしてます。

趣味

↑こういう発言
(@tail_yで見れます)

今日のテーマ

Haxeすごいからみんな使え！

Haxeのすごいところ
マルチプラットホーム
JSはもちろん、
AS C++ C# php Java
Androidネイティブも書き出せる！

「でもさ、今の仕事JSだけで
間に合ってるし。」
「作るものに合わせた言語のほう
が良くない？」

ちょっと待って！
Haxeのマルチプラットホームは
重要だけど

Haxeを使うべき理由は
別にある！

は、言語としてすごい！

TypeScript
CafeeScript
JS
柔らかい

Unity

JSX
AS3
Haxe
Unity(strict)

Java
C#系

※あくまで僕のイメージです
※Haxe、JSX、TypeScriptは型推論あり

柔らかい
すぐ書ける、短く書ける、すぐ作れる
硬い
ミスしにくい、修正時にちゃんとエラーを出す

硬い

•
•
•
•

運用の長期化
ゲームの案件増加
モバイルのリッチ化
多人数化

「硬い」言語が求められている

一般的な言語での三項演算子

Haxeのifを使った三項演算子

記述が多少長くなっても、
より人間らしい書き方が出来る
※通常の三項演算子も使用可能

一般的な言語でのfor文

Haxeのfor文

より、何が起きているか分かる構文に。
ループ中にiに代入しようとするとエラー

一般的な言語でのswitch文

Haxeでのswitch文

よく書き忘れる「break;」は無し！
（次のcaseまで処理は持続しない）
複数項目が必要なら、カンマ区切り

Haxeには、
コードが整理されたり、
バグが出にくかったり、
バグを直しやすい仕組みが
いっぱい入っている。

逆に、
よくヒューマンエラーを起こす
機能はなるべく排除されている。
（単に「便利だから」で追加しない）

Haxeのクラス基本構文

出力
[trace] Hoge.hx:6: Hello World

標準で、ファイル名と
行番号が出力される！！

「誰かの書いた出力が邪魔だから
どこにあるのか探さないと…」
という話からさよなら。
もちろん、出力はカスタマイズできる。

Function型に、引数の数や型の指定ができる！
この場合、Intを引数に取って、何も返さない関数

「いつの間にかコールバックの
引数が変わっていて実行まで気づ
かなかった。」
という話からさよなら。

こんな感じで、AS3にさらに
厳格な感じを足した感じの言語。
でも、サクサク書きたい
という時もある。

※使用エディタ IntelliJ IDEA

型を指定してない
なのに補完が出る！

型チェックもされる！

でも、使い過ぎると
逆に読みにくくなるので、
プロジェクト規約で使いドコロを
決めるといい。
オススメは、ローカル変数と、
ローカル関数を作る時だけOKとか。
特にローカル関数ではスッキリして便利

Haxeの型推論は他より強力だと評判。
コンパイラが補完機能を提供しているので、
いろいろなエディタでこの機能が使える。

JSでは、なんとDOMも型を持ち
パラメータは自動補完対象！

一部の構文では強制的に、
省略しないといけないケースもあります

型を指定できない
（確定なので）

Java系やC系に搭載されていたりする
モダンな機能がいろいろ使える。

•
•
•
•
•
•

ジェネリック
ダックタイプ
Typedef
mixin
マクロ
enum（※他言語のenumとかなり違う）

説明している時間が無い！！
自分で調べてね。

あと、getter setterの書き方も素晴らしいです。

enumはHaxeの白魔法
マクロはHaxeの黒魔法

Haxeが使用可能なエディタ

Boxer Editor
E-Texteditor
Eclipse
EditPlus
Editra
Emacs
Espresso ide
fdt
Fraise Editor
Geany
Gedit
FlashDevelop
Intellij IDEA
jEdit

Kate
Kdevelop (nix)
Komodo
Konqueror (nix)
MonoDevelop
Notepad++
Pacu
SciTE
Sublime Text 2
Sugar-hx TextMate bundle
TextMate (mac)
Ultraedit (win, nix)
Vim
www.activestate.com
Xcode (mac)

Kate
Boxer Editor
Kdevelop (nix)
E-Texteditor
Eclihxというプラグイン
Eclipse
Komodo
↑2014年現在Eclihxは開発が止まっています。Eclipse
Konqueror (nix)
EditPlus
系ではFDT5が選択肢になります。
MonoDevelop
Editra
Emacs
ちょっとHaxeへの対応は遅い Notepad++一部で高い人気。Macも
…
Espresso ide
Pacu
SciTE
fdt
Sublime Text 2
Fraise Editor
Sugar-hx TextMate bundle
Geany
Windowsユーザーなら安定
TextMate (mac)
Gedit
Ultraedit (win, nix)
FlashDevelop
Vim Macユーザーならこれかな
Intellij IDEA
jEdit
www.activestate.com
有料だけど軽くて多機能
Xcode (mac)

僕個人はFlashDevelopの一部挙動が好きでないので
IntteliJ IDEAというツールを使っています。
Haxeへの対応はプラグインが必要ですが
プラグイン機能は有料です。
↑2014年1月現在、最新のIntelliJ IDEAはプラグインも無料になり
ました。デバッグツールが有料（年間$199）となります

ちなみにFlashDevelop好きでない挙動
•
•
•

Ctrl+Clickでジャンプできない
１行コメントを含んで複数行をコメント化すると、コメント解除時に、
最初のコメントまで解除される
ナビゲートの進む戻るの挙動が、頭おかしい。

っていうか、
FlashBuilderで
対応してくださいよ！
Adobeさん。

各種言語に出力する場合

「JSだと読みにくいコードが出て
くるって聞きましたけど？」

クラスを１つ作って、
そこでtrace(“Hello World”)した。

ソースマップ付き

とくに読みにくいというわけでも
ないと思うけどな・・・。

しいて言えば、
元コードのコメントも維持してくれればいいのに…

「今までのライブラリが
使えないのは困るんですけど」

externという、他言語の
ライブラリを使用可能にする
機能があります。
ちなみにJQueryは標準実装済み
SWCも完全対応

でも、他言語の固有機能を使用すると
当然、他の言語に
出力できなくなります。
（ASの、AIR専用機能みたいなもの）

つまりFlashのMovieClipや
Spriteなんかも当然無理…

OpenFL（旧名NME）
FlashのMovieClipやSpriteといった表示APIなど
を、Haxeから各種プラットホームに出力する
ライブラリ！
Androidだろうと、
iOSだろうと、
HTML5だろうと、出力できる！

すごすぎてキモい！

話していると長くなるんで今回は無理ですが
バッテンラボラトリーというBlogで、
白玉さんという方がツールや実験結果を公開しています。
http://www.dango-itimi.com/blog/

スクエニレジェンドワールド
というブラウザゲームの
3Dバトル基本システムを担当しました。

ゲームクライアントはAS3だけど、
どうしてもサーバーと同じ処理を
ブラウザ側で行わなければ
ならない部分があった

AS3

Java

そこで、その部分だけをHaxeで記述し
２つの言語に書き出し、
それぞれの部分でライブラリとして使用。

AS3

Java

動作のブレもほとんど無く
何よりメンテナンスの際に、
同時に処理が変化してミスが無い。

大成功！
ただし、変数初期化周りの
挙動の違いに若干ハマった。
プリミティブな変数はちゃんと初期化しよう！

•
•
•
•
•

Haxeを使うとバグが起きにくい
新しい便利な機能が使える
既存のライブラリが使える
HTML5やスマホアプリに使える
OpenFLを使うと、Flashの機能もマルチプ
ラットホームで使える
• 実用実績もある

Haxeすごいからみんな使え！

ありがとうございました。

Haxeで参考になるサイト
• 公式のドキュメント（一部英語）
• QiitaのHaxeタグ
• バッテンラボラトリー
公式ドキュメントはwikiなので、英語分かる人は翻訳作業にご協力下さい。

参考になる資料
•
•
•
•
•
•
•

大規模なギョームシステムにHaxeを採用してみた話
Haxe で始める CreateJS
JSX / Haxe / TypeScript
Haxe + CreateJs を Sublime Text 2 で開発する準備をしてみたのでメモ | LLC DigiFie
JSXよりHaxeがイケてる5つの理由(実践編) もしくは Real World Haxe - みずぴー日記
IntelliJ IDEA + Haxe/CreateJS 環境構築 ( 前編 ) ｜ Developers.IO
TweenX - tween library for haxe

altJS勉強会「Haxeすごいからみんな使え！」

More Related Content

altJS勉強会「Haxeすごいからみんな使え！」