ClojureScriptさわってみた

Posted 2011年7月27日 by uchida & filed under いろいろ.

http://docs.komagata.org/4837

ClojureでClosureが書けるということなので、とりあえずgoog.events.InputHandlerのデモのコードをClojureScriptで書いてみました。
http://code.google.com/p/closure-library/source/browse/trunk/closure/goog/demos/inputhandler.html
http://closure-library.googlecode.com/svn/trunk/closure/goog/demos/inputhandler.html

(ns ih
 (:require [goog.dom :as dom]
            [goog.events :as events]
            [goog.events.InputHandler :as InputHandler]))

(defn ^:export add-some [id]
  (let [el (dom/getElement id)]
    (set! (.value el) (str (.value el) "."))))

(defn update-text [e]
  (let [inputEl (.target e)
        outputEl (.nextSibling inputEl)]
    (loop []
      (when (.call (.hasChildNodes outputEl) outputEl)
        (.removeChild outputEl (.lastChild outputEl))
        (recur)))
    (.appendChild outputEl (.createTextNode (.document goog.global) (.value inputEl)))))

(defn ^:export main []
  (let [textIh (new goog.events/InputHandler (dom/getElement "text"))
        passwordIh (new goog.events/InputHandler (dom/getElement "password"))
        textareaIh (new goog.events/InputHandler (dom/getElement "textarea"))]
    (events/listen textIh goog.events.InputHandler/EventType.INPUT update-text)
    (events/listen passwordIh goog.events.InputHandler/EventType.INPUT update-text)
    (events/listen textareaIh goog.events.InputHandler/EventType.INPUT update-text)

    (events/listen goog.global "unload"
                    (fn [event]
                      (events/unlisten textIh goog.events.InputHandler/EventType.INPUT update-text)
                      (events/unlisten passwordIh goog.events.InputHandler/EventType.INPUT update-text)
                      (events/unlisten textareaIh goog.events.InputHandler/EventType.INPUT update-text)
                      ))))

(ns ih

(:require [goog.dom :as dom]

[goog.events :as events]

[goog.events.InputHandler :as InputHandler]))

(defn ^:export add-some [id]

(let [el (dom/getElement id)]

(set! (.value el) (str (.value el) "."))))

(defn update-text [e]

(let [inputEl (.target e)

outputEl (.nextSibling inputEl)]

(loop []

(when (.call (.hasChildNodes outputEl) outputEl)

(.removeChild outputEl (.lastChild outputEl))

(recur)))

(.appendChild outputEl (.createTextNode (.document goog.global) (.value inputEl)))))

(defn ^:export main []

(let [textIh (new goog.events/InputHandler (dom/getElement "text"))

passwordIh (new goog.events/InputHandler (dom/getElement "password"))

textareaIh (new goog.events/InputHandler (dom/getElement "textarea"))]

(events/listen textIh goog.events.InputHandler/EventType.INPUT update-text)

(events/listen passwordIh goog.events.InputHandler/EventType.INPUT update-text)

(events/listen textareaIh goog.events.InputHandler/EventType.INPUT update-text)

(events/listen goog.global "unload"

(fn [event]

(events/unlisten textIh goog.events.InputHandler/EventType.INPUT update-text)

(events/unlisten passwordIh goog.events.InputHandler/EventType.INPUT update-text)

(events/unlisten textareaIh goog.events.InputHandler/EventType.INPUT update-text)

))))

demo

Clojureは触ったことなかったのでよくわかりませんが以下のような点が気になりました。

namespaceの「.」と「/」の使い分け方がよくわからない
goog.events.InputHandler/EventType.INPUTとか。
グローバルオブジェクトの取得方法がわからない
とりあえずgoog.global経由で取得。
プロパティ取得とメソッド実行をどう指定すればいいのかわからない

outputEl.hasChildNodes()

1

outputEl.hasChildNodes()

のつもりで

(.hasChildNodes outputEl)

1

(.hasChildNodes outputEl)

としたら

outputEl.hasChildNodes

1

outputEl.hasChildNodes

に変換されました。しょうがないのでcallを使って

(.call (.hasChildNodes outputEl) outputEl)

1

(.call (.hasChildNodes outputEl) outputEl)
関数の最後の式が勝手にreturnされる
JSerにとっては落とし穴になると思う。
文字列の結合が全部goog.string.StringBufferになる？
2つの文字列結合程度だとオーバースペック気味。
関数呼び出しが全部callになる？
コンパイルレベルを下げるとよくわかりますが

func.call(null,arg1)

1

func.call(null,arg1)

みたいのがやたら多く見られます。strict modeさえ使えれば…