Underscore.jsってなに

標準のJavaScriptに無い便利なモジュールがたくさん入っています。Backbone.jsが標準で使ってるやつです。

サンプル

var shuffleArray = _.shuffle([1,2,3,4,5]);
console.dir(shuffleArray);

shuffle別の書き方

console.dir(_([1,2,3,4,5]).shuffle());

each

_(_([
    {name: "A", power: 10},
    {name: "B", power: 20},
    {name: "C", power: 15},
]).shuffle()).each(function (l) {
    console.log(l.name, l.power);
});

_.each(_.shuffle([
    {name: "A", power: 10},
    {name: "B", power: 20},
    {name: "C", power: 15},
]), function (l) {
    console.log(l.name, l.power);
});

map

console.dir(_([1,2,3,4,5]).map(function (l) {
    return l+5; // +5した値で新たに配列を作成
}));

console.dir(_.map([1,2,3,4,5], function (l) {
    return l+5;
}));

range

console.log(_.range(5)); // 0,1,2,3,4

random

console.log(_.random(-100, 100)); // -100から100の間のランダムな値

find

console.log(_([1,2,3,4,5]).find(function (l) {
    return l > 2; // 2より大きな数で、最初にマッチした数を返す
}));

console.log(_.find([1,2,3,4,5], function (l) {
    return l > 2;
}));

filter

console.dir(_([1,2,3,4,5]).filter(function (l) {
    return l > 2; // 2より大きな数全て、マッチした数を返す
}));

console.dir(_.filter([1,2,3,4,5], function (l) {
    return l > 2;
}));

contains

// containsは、指定したデータが含まれているかどうかを返す
console.log(_([1,3,12,8,9,12,12,9]).contains(12));

console.log(_.contains([1,3,12,8,9,12,12,9], 12));

keys

// keysは、オブジェクトのプロパティをすべて配列で出す
console.log(_({"a": 1, "b": 2, "c": 3}).keys());

console.log(_.keys({"a": 1, "b": 2, "c": 3}));

values

// valuesは、オブジェクトのプロパティの値をすべて配列で出す
console.log(_({"a": 1, "b": 2, "c": 3}).values());

console.log(_.values({"a": 1, "b": 2, "c": 3}));

has

// hasは、プロパティ名が含まれているかを調べる
console.log(_({"a": 1, "b": 2, "c": 3}).has("a"));

console.log(_.has({"a": 1, "b": 2, "c": 3}, "a"));

groupBy

// groupByは、登録した関数の返り値で分類してオブジェクト化してくれる
console.dir(_([1,3,12,8,9,12,12,9]).groupBy(function (num) {
    return num%2; // 奇数と偶数に分類
}));

console.dir(_.groupBy([1,3,12,8,9,12,12,9], function (num) {
    return num%2;
}));

countBy

// countByはgroupByと似ていて、分類する
// ただ、違うのは分類後のカウント数を返す
console.dir(_([1,3,12,8,9,12,12,9]).countBy(function (num) {
    return num%2; // 奇数と偶数に分類
}));

console.dir(_.countBy([1,3,12,8,9,12,12,9], function (num) {
    return num%2;
}));

sortBy

// sortByは、登録した返り値でソートする
console.dir(_([1,3,12,8,9,12,12,9]).sortBy(function (num) {
    return num;
}));

console.dir(_.sortBy([1,3,12,8,9,12,12,9], function (num) {
    return num;
}));

union

// unionは、ユニークな値だけで配列を作成する
console.log(_([1,3,12,8,9,12,12,9,4]).union());

console.log(_.union([1,3,12,8,9,12,12,9,4]));

uniq

// uniqは、ユニークな値だけで配列を作成する
// 既にソート済みだったら、引数にtrueを渡すとより高速に動作する(らしい)
// デフォルトはfalse
console.log(_([1,3,12,8,9,12,12,9,4]).uniq(false));

console.log(_.uniq([1,3,12,8,9,12,12,9,4], false));

かんそう

ruby的な便利関数を_()で書けるようになる感じでしょうか。

...実は上記のほとんど、tmlib.jsでできるんですよ。というステマ。

[1,2,3,4].shuffle().each(function (l) {
    console.log(l);
});

という感じで。

templateについては別途まとめながら触ってみようかなぁ。

[Underscore.js]よく使いそうなモジュールまとめてみた

Underscore.jsってなに

サンプル

かんそう