50

ネストされた配列構造があるとします。

var nested = [ [1], [2], [3] ];

underscore.jsを使用して、フラット化された配列をどのように生成しますか?

C# では、次Enumerable.SelectManyのように使用します。

var flattened = nested.SelectMany(item => item);

この場合のラムダは、ネストされた項目を直接選択しますが、任意の式である可能性があることに注意してください。

jQuery では、次のように使用できます。

var flattened = $.map(nested, function(item) { return item; });

ただし、このアプローチはアンダースコアのマップ機能では機能しません。

[1, 2, 3]では、 underscore.js を使用してフラット化された配列を取得するにはどうすればよいでしょうか?

4

4 に答える 4

44

JSON からの配列など、少し複雑な配列がある場合は、次のように、関心のある特定のプロパティを抽出して、 pluckメソッドを利用することもできます。parents.SelectMany(parent => parent.Items);

// underscore version
var allitems = _.flatten(_.pluck(parents, 'items'));

allitemsは、親からのすべてのサブアイテムの配列になりました[a,b,c,d]。

そして、同じことを示すJSFiddle。

または、lodash を使用している場合は、バージョン 4 以降で使用できる_.flatMap関数を使用して同じことを行うことができます。コメントで指摘してくれた Noel に感謝します。

var parents = [
  { name: 'hello', items: ['a', 'b'] },
  { name: 'world', items: ['c', 'd'] }
];


// version 1 of lodash, straight up
var allitems = _.flatMap(parents, 'items');
logIt('straight', allitems);

// or by wrapping the collection first
var allitems = _(parents)
  .flatMap('items')
  .value();
logIt('wrapped', allitems);

// this basically does _(parents).map('items').flatten().value();

function logIt(wat, value) {
  console.log(wat, value)
}
<script src="https://cdn.jsdelivr.net/lodash/4.16.6/lodash.min.js"></script>
<pre id="result"></pre>

もっと多くのことをしたいが、演算子を連鎖させたくない場合は、flow関数を使用して同じ効果を得ることができます。これは、最終的なペイロードを最適化できるため、TypeScript を使用して各オペレーターを個別にインポートする場合に便利です。

const parents = [
  { name: 'hello', items: ['a', 'b'] },
  { name: 'world', items: ['c', 'd'] }
];
logIt('original', parents);

const result = _.flow(
  (collection) => _.flatMap(collection, (item) => item.items),
  (flattened) => flattened.filter((item) => item !== 'd')
)(parents);
logIt('result without "d"', result);

function logIt(wat, value) {
  console.log(wat, value);
}
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script>
<pre id="result"></pre>

于 2014-08-04T19:28:16.473 に答える
3

Patrick のソリューションを mixin にして、連鎖可能にすることもできます。

_.mixin({
    selectMany: function(collection, iteratee=_.identity) {
        return _.flatten(_.map(collection, iteratee));
    }
});

例:

let sample = [{a:[1,2],b:'x'},{a:[3,4],b:'y'}];

console.log(_.selectMany(sample, 'a')); // [ 1, 2, 3, 4 ]
console.log(_.chain(sample).selectMany(o => o.a).filter(a => a % 2 === 0).map(a => a * 3).value()); // [ 6, 12 ]
于 2016-05-18T20:39:43.273 に答える
2

I couldn't find any methods in lodash that work quite like SelectMany, so I created one using pure JS:

Array.prototype.selectMany = function(fn) {
    return Array.prototype.concat(...this.map(fn));
};

Boom.

> console.log([{a:[1,2],b:'x'},{a:[3,4],b:'y'}].selectMany(o => o.a));
[ 1, 2, 3, 4 ]
于 2016-05-05T16:50:10.790 に答える