Groovy勉強したら、prototype.js使えるようになってた

Groovy,JavaScript

今更ですが、prototype.jsのネタを。

一年以上も前のプロジェクトでprototype.jsを使用したWEBシステムを構築しました。

prototype.js v1.5.0 の使い方を参考に、勉強がてら調べながらシステム構築しました。その時には$()や$F()の利用方法を学ぶ程度、Event.observeを利用する程度までしか本質を理解できませんでした。

Groovyを勉強した現在、上記システムの改修作業に携わっているのですが、prototype.jsの見方がかなりかわってきています。特にArrayまわり。

GroovyのListには

  • find
  • findAll
  • collect
  • each
  • any
  • all

といった便利なメソッドが用意されており、ループ処理を簡単に記述できます。

prototype.jsを利用すると同様のことがjavascriptでも実現できるようです。（ちなみにprototype.jsを使用するにはサイトからダウンロードしてきたjsファイルをhtmlにインポートするだけです。）

// これで、"[taro]", "[hanako]", "[jiro]"という文字配列がセットされる
var newlist = ["taro", "hanako", "jiro"].collect(function(name){
    return "[" + name + "]";
})

適用前は

// これで、"[taro]", "[hanako]", "[jiro]"という文字配列がセットされる
var names = ["taro", "hanako", "jiro"]
var newlist = []
for( var i = 0; i < names.length; i++ ){
    newlist.push("[" + name + "]");
)

少しだけコードが減って見やすくなっています（かな？）

これが生きてくるのは

list.findAll(…).collect(…).each(…);

などのように、連想的にメソッドを呼び出す場合でしょう。その場合には確かにソースコードは減るし、見やすくなるように感じます。

これと比べるとgroovyの同メソッドなどの構文がいかにシンプルかが分かります。

// これで、"[taro]", "[hanako]", "[jiro]"という文字配列がセットされる
def newlist = ["taro", "hanako", "jiro"].collect{
    "[" + it + "]";
}

groovyと比較して、prototype.js(javascript)を利用した場合の面倒さとしては以下のように感じました。

  1. クロージャの記述の際に、毎回functionの記述が必要。
  2. クロージャの返却値として必ずreturnの記述が必要。

特にgrovyの癖で２番を忘れるため、何度やっても返却値の配列が空になってしまうことがよくありました。

 

javascriptエンジンRhino上でprototype.jsを利用することもできるようです。

Rhinoでprotoype.js – みずぴー日記

試してみたら確かに動いた♪

Groovy,JavaScript