Underscore.js 1.7の使い方 Chaining編

Underscore.js 1.7の使い方 Chaining編

Underscore.jsの記述順

下記のように2通りの書き方が可能。ただし一般的には前者の記述で書かれていることが多い。

_.map([1, 2, 3], function(n){ return n * 2; });
_([1, 2, 3]).map(function(n){ return n * 2; });

chainについて

chainを使用すればUnderscore.jsの各メソッドをつなげて処理することができる。

var r = document.getElementById("r");
var data = [
  {name: 'sato', age: 20},
  {name: 'suzuki', age: 30}
];
r.innerHTML =
  _.chain(data)
    .map(function(data) {
      return data.name + ' ' + data.age;
    })
    .first()
    .value();
// => sato 20

サンプル

valueについて

ラップされたオブジェクトの値を抽出します

var r = document.getElementById("r");
r.innerHTML = _([1, 2, 3]).value();
// => [1, 2, 3]

サンプル

備考

  • Underscore.jsは配列の処理だけでなく関数やイベントの処理などもあるため覚えておくと便利
  • r.innerHTMLで配列を挿入した場合は[1,2,3]は1,2,3と表示される
  • jQueryなどにもmapなどはあるため併用している場合はどちらを使用するか決めておいたほうが整合性が取れる

ほかのUnderscore.jsの記事