JSXからjQueryを使ってDOMの情報を操作 その2
jquery-1.7.jsxを作って、さっきの全部自分でキャストしていたバージョンに比べてだいぶ見やすくなりました。
import "jquery-1.7.jsx"; class _Main { static function main(args : string[]) : void { var value : string = jQuery.as_func("p").get(0).innerHTML; log value + "---" + value; jQuery.as_func("p").get(1).innerHTML = "piyo"; } }
つまづいたところはまず「関数であり、かつメンバも持っている」というUnionな型を定義する方法がない点。とりあえずjQuery.as_funcってメソッドで関数としてキャストしたものを返すようにしてみた。(しかしこういう実体のあるメソッドを持っているとnative classになれないかもしれない)
次に、$("p")の返り値の型はなんなのか、という点。これをxとすると、x[0]ができて、かつx.clickもできないといけない。Arrayにキャストすることはできないのでas_arrayってメソッドを作る訳にはいかない。かといってclassにするには0とか1って名前のメンバは作れないし…。classにして配列アクセスだけgetってメソッドを作ればいい??
などと悩んでいるうちにもう夜の8時になってしまったのでひとまずできたところまで公開。
https://github.com/nishio/learning_jsx/tree/master/use_native_class
use_native_classって書いたのにnative classまだ使ってない。そしてdevelopブランチに入れてある方は、$("p").cssと同じ物がとれているように見えるのに、なぜかそれを呼ぶとWindowが返ってくるという謎の状態になっている。
https://github.com/nishio/learning_jsx/blob/ac1ffde2d515d4d8a09a94ed3cbac2f023e81569/use_native_class/jquery-1.7.jsx
(追記: あっ、わかった、関数を取ってからそれを呼んでいるせいで$("p").cssの中のthisがWindowを指すようになっているんだな。つまりMapにキャストしたのは間違いということか。続編→JSXに「このオブジェクトはfooを持っているはず」と教えるには)
っていうかjQueryが型の意味では汚すぎるのが問題なんだと思うなぁ。字数を少し削減するためだけに「関数でもありオブジェクトでもあります」ってやるあたりとか。