Underscore.js 1.7の使い方 Arrays編

Underscore.js 1.7の使い方 Arrays編

first

配列の最初の要素を返す

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

第2引数に個数を入れると最初の要素を指定した個数分返す

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

サンプル

initial

配列の最後の要素以外を返す

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

第2引数に個数を入れると最後の要素を指定した個数分返さなくなる

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

サンプル

last

配列の最後の要素を返す

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

第2引数に個数を入れると最後の要素を指定した個数分返す

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

サンプル

rest

配列の最初以外の要素を返す

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

第2引数に個数を入れると最初の要素を指定した個数分返さなくなる

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

サンプル

compact

配列内の0, null, 空文字, undefined, NaN以外の要素を返す

var r = document.getElementById("r");
r.innerHTML = _.compact([0, 1, '通', 'SUN', null, '', undefined, NaN]);
// => [1, '通', 'SUN']

サンプル

flatten

入れ子になっている配列を1つにまとめる

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

サンプル

without

第2引数以降に指定した値を配列内から取り除く

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

サンプル

union

複数の配列を1つの配列に統合する

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

サンプル

intersection

複数の配列の要素の共通部分から1つの配列を返す

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

サンプル

difference

第2引数以降の配列内の要素にない配列を返す

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

サンプル

uniq

重複した要素を除外した配列を返す

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

配列がソートされている場合は第2引数にtrueを指定すると高速に動作する

_.uniq([1, 2, 2, 3, 3, 4], true);
// => [1, 2, 3]

// ソートされていないと重複が正しく除外されない
_.uniq([1, 2, 2, 3, 4, 3], true);
// => [1, 2, 3, 4, 3]

サンプル

zip

対応する位置の値を持つ配列の各値を一緒にマージして配列で返す

var r = document.getElementById("r");
r.innerHTML = _.zip(['sato', 'suzuki'], [20, 30], [165, 175]);
// => [["sato", 20, 165], ["suzuki", 30, 175]]

_.zip.apply()を使用すれば逆のことが可能

var r2 = document.getElementById("r2");
r2.innerHTML = _.zip.apply(_, [["sato", 20, 165], ["suzuki", 30, 175]])
// =>  [["sato", "suzuki"], [20, 30], [165, 175]]

サンプル

object

配列をオブジェクトで返す

var r = document.getElementById("r");
var obj = _.object(["sato", "suzuki"], [20, 30]);
r.innerHTML = obj.sato + ' ' + obj.suzuki;
// => 20 30

サンプル

indexOf

指定した値のあるインデックスを返す
(左から検索して最初の1つのみ検出)

var r = document.getElementById("r");
r.innerHTML = _.indexOf(['a', 'b', 'c', 'b'], 'b');
// => 1

サンプル

lastIndexOf

指定した値のあるインデックスを返す
(右から検索して最初の1つのみ検出)

var r = document.getElementById("r");
r.innerHTML = _.lastIndexOf(['a', 'b', 'c', 'b'], 'b');
// => 3

サンプル

sortedIndex

バイナリサーチで検出した値のあるインデックスを返す

var r = document.getElementById("r");
r.innerHTML = _.sortedIndex([10, 20, 30], 25);
// => 2

サンプル

range

指定した範囲の値のある配列を返す

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

var r2 = document.getElementById("r2");
r2.innerHTML = _.range(1, 5);
// => [1, 2, 3, 4]

var r3 = document.getElementById("r3");
r3.innerHTML = _.range(0, 20, 5);
// 第3引数にステップ数を指定可能
// => [0, 5, 10, 15, 20]

サンプル

ほかのUnderscore.jsの記事