to4iki/memo.md

## memo.md

      
    Raw
  

              memo.md
            
          
JavaScriptの便利なユーティリティライブラリ(配列操作やオブジェクト処理に便利な関数群を提供する)
特にコレクション操作に特化していると個人的には思う
非依存のため、稼働中のアプリケーションにも導入が簡単
Rubyチックに記述可能(ラップして書くこと)
Backborn.jsに組み込まれている
underscore.js/underscore-min.jsを読み込んで使用する

読み込んだらunderscoreのオブジェクト _ が使用可能になる
使い方は _.size() みたいな書き方 or _(5).times みたいにオブジェクトをラップするような書き方とどちらでも良い
集合要素のすべての要素に対して処理を施す

★each

繰り替えし実行
関数の引数にそれぞれの要素が入ってくる
_.each([2,4,8], function(num) {
  console.log(num * 2); // 4, 8, 16
});

forEach コールバックの第一引数がvalueとなる
_({ one:1, two: 2, three: 3}).each( function( value, key ) {
  console.log('value:' + value + ' key:' + key ); // 
})

★map

処理結果を配列で受けとる
var x = _.map([3, 6, 12], function(num) {
  return num * 2;
});
console.log(x); // [6, 12, 24]

集合要素に関してある条件判定をする

find

最初に条件にマッチした要素のみを探す
var a = [1, 2, 4, 16, 32, 64];
var x = _.find(a, function(num) {
  return num > 5 // 16
});

filter

条件にマッチした要素全てを配列で返す
var a = [1, 2, 4, 16, 32, 64];
var x = _.filter(a, function(num) {
  return num > 5 // [16, 32, 64]
});

contains

要素があるかどうか？
true/falseで返す
var a = [1, 2, 4, 16, 32, 64];
y = _.contains(a, 5); // false

★all

リストが全て真ならtrueを返す。
一つでもfalseとなる要素がある場合はfalseを返す。
_([1,2,3]).all(function(num) {
  return num % 2 === 0; // false
});

★any

リストの要素が1つでも真値テストを通過した場合、trueを返す。そうでない場合はfalseを返す。
trueとなる要素が見つかると、それより後の要素は調べない。
_([1,2,3]).any(function(num) {
  return num % 2 === 0; // true
});

reduce


_.reduce(list, iterator, memo, [context])

リストの要素を１つの値に集約する。memoが初期値。iteratorはステップごとに値を返さなければいけない。
detect


_.detect(list, iterator, [context])

リストの要素の中から、一番最初に真値テスト(iterator)を通過したものを返す。
select / reject


_.select(list, iterator, [context])
_.reject(list, iterator, [context])

リストの要素の中から、真値テスト(iterator)を通過したものを返す。 / リストの要素の中から、真値テスト(iterator)を通過しなかったものを返す。
集合要素に対して集計処理をする

groupBy

グルーピング
// 集合要素aは前述と同じ
x = _(a).groupBy(function(num) {
  return num % 3;
})

countBy

数を返す
// 集合要素aは前述と同じ
x = _(a).countBy( function(num) {
  return num % 2 === 0 ? 'even' : 'odd'; // Object {odd: 1, even: 5} 
})

sortBy

_.sortBy(['me', 'i', 'and'], 'length')); // ["i", "me", "and"] 

集合に関する演算を行う

union、intersection、difference、uniq

var a = [1, 2, 5];
var b = [5, 2, 8];

// union 和集合
_.union(a, b); // [1, 2, 5]

// intersection 共通
_.intersection(a, b) // [2 ,5]

// difference 差分
_.difference(a, b)); // [1] bにはないaの要素

// uniq 重複を取り除く
_([2, 5, 3, 5, 10, 2]).uniq() // [2, 5, 3, 10]

オブジェクト型に対して使えるメソッド

keys, values

var x;
var user = {
  name: 'hoge',
  score: 100,
  say: function(){
    console.log('hello ' + this.name);
  }
};

_(user).keys();		// ["name", "score", "say"] 
_(user).values();	// ["hoge", 100, function]

has

オブジェクトにkeyが存在するか
_(user).has('name'); // true

is系

入力検証に
// isEmpty, isString, isNull, isNumber, isArray, isDate...
_.isString(user.score); // false

データを生成する

range、random、escape、times

// 1~10の配列を作成
_.range(1, 11); // [1,2,3,4,5,6,7,8,9,10]
// 第一引数を省略すると0から作成
// 第三引数にstep数
_.range(1, 11); // [1, 3, 5, 7, 9] 

// 乱数の作成
_.random(3, 10) // 3~10までの乱数値 10も含む

// エスケープした文字の作成
_.escape('<script>'); // &lt;script&gt; 

// 単純繰り返し
_(5).times(function() {
  console.log('hello'); // hello x 5
});

複数のメソッドをつなげて実行

chain、value

chainで繋げる
valueで終わらせる
x = _([2,4,8])
      .chain()
      .shuffle()
      .map(function(num) {
        return num * (_.random(3));
      })
      .value(); // シャッフルしてそれぞれを0~3の乱数倍した値

オブジェクトの内容をはめ込んでいくテンプレート機能

★template

<% %> jsの命令をそのまま記述可能
<%= %> 値をそのまま出力
<%- %>	値をエスケープして出力(ユーザからの入力を受け取って出力の際はこちらを利用した方が良さげ)
var x;
var user = {
    name: 'hoge',
    score: 50,
};

var tpl = "<% console.log('hello from tpl'); %><li><%- name %> (<%- score %>)</li>";
x = _.template(tpl, user); // hello from tpl <li>hoge (50)</li> 	

参考

Underscore.js入門 (全10回) - プログラミングならドットインストール
Underscore.js はもっと評価されていい - present
便利機能満載のライブラリUnderscore.js - にのせき日記
enja-oss/Underscore · GitHub
ise0615 blog: Underscore.js について纏めてみた