underscore.jsの使い方

underscore.jsはjavascriptの配列やJSON形式のデータを操作するのを簡単にしてくれるライブラリです。

シンプルなライブラリなのでソースを解読することが容易です。

underscore.jsのソース

以下のようにプリロードして使います。

100くらいメソッドがあるようですが、代表的なものを紹介します。

_.each(別名:_.foreach)

Arrayをイテレートします。以下は配列要素を順次、無名関数に渡してalertしています。

デモです。

上記は以下のように関数を省くことも可能です。

デモです。

_.sortBy

JSON形式のデータをソートします。ソートするデータは以下ではnoの昇順です。

デモです。

_.times

第一引数で指定した回数無名関数を実行します。

デモです。

_.contains(別名:_.include)

第一引数の配列要素に、第二引数が含まれていればtrue、そうでなければfalseを返します。

デモです。

_.pairs

引数にJSON形式のデータを渡すと以下のデモのようになります。

デモです。

{}でデータを渡すと配列に変換します。

デモです。

上記を_.eachの第一引数に配列として渡して、イテレートすると配列であることがわかりやすいです。

デモです。

_.map

_.mapは_.eachと非常によく似ています。

配列をイテレートし、順次処理して、その結果を配列として返します。

デモです。

上記のデモでは配列自体がアラートされますが、_.eachを使用して配列要素を順次アラートすることができます。これで_.mapが返すのは配列であるとわかりやすいと思います。

デモです。

_.filter

配列要素を順次、第二引数の関数で処理し、戻り値が真の配列要素のみを配列として返します。

デモです。

_.find(別名:detect)

_.filterと同じく配列要素を順次、第二引数の関数で処理し、戻り値が真の配列要素を、最初の一つだけ返します。ここが_.filterと_.findの違いです。

デモです。

_.reject

_.findの逆で、第二引数の関数で処理し、戻り値が偽の配列要素のみを配列として返します。

デモです。

_.reduce(別名:_.foldl,_.inject)

説明しづらいメソッドですが、配列要素を一つの結果にまとめるメソッドです。

以下は配列要素を全部掛け算している例です。第二引数の無名関数の第一引数が戻り値、第二引数に配列要素が順次割り当てられるようです。

デモです。

_.every(別名:_.all)

配列要素を順次、第二引数の関数で処理し、全ての戻り値が真の配列要素のみ、true、一つでもfalseがあればfalseを返します。

デモです。

falseとなる例です。

デモです。

_.max

このメソッドは最大値を返します。第一引数に配列を渡し、第二引数の戻り値に比較する配列要素を指定します。

デモです。

_.min

_.maxの逆で、配列内の最小値のオブジェクトが返ってきます。

デモです。

スポンサーリンク
  • このエントリーをはてなブックマークに追加
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA