javascript - 在使用 Lo-Dash 3.0 转换值时有什么好的 groupBy 方法？

Question

给定一个像这样的对象数组:

var data = [
    {key: 'a', val: '1'}, 
    {key: 'a', val: '2'}, 
    {key: 'b', val: '3'}, 
    {key: 'c', val: '4'}, 
    {key: 'c', val: '5'}, 
    {key: 'c', val: '6'}
];

我想把它转换成这样:

var desiredResults = {
    'a': [1, 2], 
    'b': [3], 
    'c': [4, 5, 6]
};

到目前为止，我已经找到了两种使用 lodash-fp 实现此目的的方法，但我仍然想知道是否有更好的方法。

第一种方式有点程序化:

var out = _(data)
    .transform(function(out, item) {
        out[item.key] = out[item.key] || [];
        out[item.key].push(item.val);
    }, {});

第二种方式是我希望实现的无点风格:

var out = _(data)
    .groupBy(_.property('key'))
    .mapValues(_.map(_.property('val')))
    .value();
// Yes, I know that _.property is implied if I just pass a string

但是，这比我想要的更困惑:我必须迭代中间结果以转换分组值，而且我认为它模糊了代码试图完成的内容。不过，我不能先进行转换，因为我想要的转换会删除键!

是否有类似groupByTransforming(groupIteratee, transformIteratee) 方法的东西？

Answer 1

我对 LoDash 一无所知(抱歉)，但我有一个简单的函数可以做你想做的事，只需要使用 vanilla JS:

/**
 * Maps an array of objects into a single object,
 * grouped by one property and supplying another.
 * @param  {Array}  input     The array of objects containg data
 * @param  {String} groupBy   The name of the property to group the elements by
 * @param  {String} groupProp The property to push into each array
 * @return {Object}           The mapped object.
 */
function mapToObject(input, groupBy, groupProp) {

    var obj = {};

    // Loop through the data
    input.forEach(function (data) {
        // If the output object doesn't contain the key,
        // make it as an empty array
        if (!obj[data[groupBy]]) {
            obj[data[groupBy]] = [];
        };
        // Push the value into the obj[groupBy] array
        obj[data[groupBy]].push(data[groupProp]); 
    });

    return obj;

}

在你的情况下，你会像这样使用它:

mapToObject(data, 'key', 'val')，因此它会返回按“key”分组且值为“val”的数据的对象。有关示例，请参见下面的代码段:

var data = [
    {key: 'a', val: '1'}, 
    {key: 'a', val: '2'}, 
    {key: 'b', val: '3'}, 
    {key: 'c', val: '4'}, 
    {key: 'c', val: '5'}, 
    {key: 'c', val: '6'}
];

/**
 * Maps an array of objects into a single object,
 * grouped by one property and supplying another.
 * @param  {Array}  input     The array of objects containg data
 * @param  {String} groupBy   The name of the property to group the elements by
 * @param  {String} groupProp The property to push into each array
 * @return {Object}           The mapped object.
 */
function mapToObject(input, groupBy, groupProp) {

	var obj = {};

	// Loop through the data
	input.forEach(function (data) {
		// If the output object doesn't contain the key,
		// make it as an empty array
		if (!obj[data[groupBy]]) {
			obj[data[groupBy]] = [];
		};
		// Push the value into the obj[groupBy] array
		obj[data[groupBy]].push(data[groupProp]); 
	});

	return obj;

}

// Just to show example output:
document.write(JSON.stringify(mapToObject(data, 'key', 'val')));