array group by key javascript

calendar

Array.reduce

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce


result = array.reduce((h, obj) => Object.assign(h, { [obj.key]:( h[obj.key] || [] ).concat(obj) }), {}) var cars = [{ make: 'audi', model: 'r8', year: '2012' }, { make: 'audi', model: 'rs5', year: '2013' }, { make: 'ford', model: 'mustang', year: '2012' }, { make: 'ford', model: 'fusion', year: '2015' }, { make: 'kia', model: 'optima', year: '2012' }], result = cars.reduce(function (r, a) {
r[a.make] = r[a.make] || [];
r[a.make].push(a);
return r;
}, Object.create(null)); console.log(result);

groupBy

https://learnwithparam.com/blog/how-to-group-by-array-of-objects-using-a-key/

const groupBy = (array, key) => {
return array.reduce((result, currentValue) => {
(result[currentValue.color] = result[currentValue.color] || []).push(
currentValue
);
console.log(result);
return result;
}, {});
};

// this step of code can be restructured to multiple lines, see below for the multi line code
(result[currentValue[key]] = result[currentValue[key]] || []).push(
currentValue
); // This is how the above code in multiple line
if (!result[currentValue[key]]) {
result[currentValue[key]] = [];
}
result[currentValue[key]].push(currentValue);

_.groupBy

https://lodash.com/docs/4.17.2#groupBy




OK



const log = console.log;

const events = [
{
"id": 210404,
"productId": 13602,
"activityEventId": 8623896,
"ticketCategoryId": 5246754,
"ticketGroupId": 81798755,
"start": 1617532218562,
"end": 1617532218562,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 210403,
"productId": 13602,
"activityEventId": 7623896,
"ticketCategoryId": 5246754,
"ticketGroupId": 71798755,
"start": 1617432218562,
"end": 1617432218562,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 191837,
"productId": 13602,
"activityEventId": 1623896,
"ticketCategoryId": 5246754,
"ticketGroupId": 61798755,
"start": 1585497600000,
"end": 1585497600000,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 191812,
"productId": 13602,
"activityEventId": 1623891,
"ticketCategoryId": 5246729,
"ticketGroupId": 61798730,
"start": 1585584000000,
"end": 1585584000000,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 191701,
"productId": 13602,
"activityEventId": 5623852,
"ticketCategoryId": 5246618,
"ticketGroupId": 51798619,
"start": 1585670400000,
"end": 1585670400000,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 191749,
"productId": 13602,
"activityEventId": 4623876,
"ticketCategoryId": 5246666,
"ticketGroupId": 41798667,
"start": 1585756800000,
"end": 1585756800000,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 191737,
"productId": 13602,
"activityEventId": 3623870,
"ticketCategoryId": 5246654,
"ticketGroupId": 31798655,
"start": 1585843200000,
"end": 1585843200000,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
},
{
"id": 262539,
"productId": 13602,
"activityEventId": 1651249,
"ticketCategoryId": 5319475,
"ticketGroupId": 11872015,
"start": 1588089600000,
"end": 1588089600000,
"ticketsNumber": 100,
"lowPrice": 127.00,
"status": 0,
"priceLowest": false,
"hasTicket": true,
"availableNumbers": [
1,
2,
3,
4,
5,
6
]
}
]; // log(`events`, events) const dateShaper = (timestamp = ``) => {
const date = new Date(timestamp)
const dateString = date.toLocaleDateString();
const timeString = date.toLocaleTimeString();
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
const weekDays = ["日", "一", "二", "三", "四", "五", "六"];
const weekDay = weekDays[date.getDay()];
return {
dateString,
timeString,
year,
month,
day,
weekDay,
};
} const thisYear = new Date().getFullYear(); const tabs = events.map((obj, i) => {
const {
start,
} = obj;
const date = new Date(start);
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
const tabName = thisYear === year ? `${month}月` : `${year}年${month}月`;
// const tabGroupKey = thisYear !== year ? `${year}_` + `${month}`.padStart(2, `0`) : `${month}`.padStart(2, `0`);
const tabGroupKey = `${year}_` + `${month}_`.padStart(3, `0`) + `${day}`.padStart(2, `0`);
// const tabGroupKey = `${year}_${month}_${day}`;
return {
...obj,
tabName,
tabGroupKey,
};
}); // log(`tabs`, tabs) const sortedArray = tabs.sort((a, b) => a.start > b.start ? 1 : -1); // log(`sortedArray`, sortedArray) // const groupBy = (array, key) => {
// return array.reduce((result, currentValue) => {
// result[currentValue.key] = result[currentValue.key] || [];
// result[currentValue.key].push(
// currentValue,
// );
// // console.log(result);
// return result;
// }, {});
// }; // const groupBy = (array, key) => {
// return array.reduce((result, currentValue) => {
// result[currentValue.key] = result[currentValue.key] || [];
// result[currentValue.key].push(
// currentValue,
// );
// // console.log(result);
// return result;
// }, []);// array
// }; const groupBy = (array, key) => array.reduce((h, obj) => Object.assign(h, { [obj[key]]:( h[obj[key]] || [] ).concat(obj) }), []);
// const groupBy = (array, key) => array.reduce((h, obj) => Object.assign(h, { [obj[key]]:( h[obj[key]] || [] ).concat(obj) }), {});
// const groupBy = (array, key) => array.reduce((h, obj) => Object.assign(h, { [obj.key]:( h[obj.key] || [] ).concat(obj) }), {}); //
const groupedArray = groupBy(sortedArray, `tabName`);
// const groupedArray = groupBy(sortedArray, `tabGroupKey`); log(`groupedArray`, groupedArray) // log(`groupedArray[0]`, groupedArray[0]) Object.keys(groupedArray).map((month, i) => {
log(`tab month`, month, i)
}) Object.values(groupedArray).map((month, i) => {
log(`tab month`, month, i)
}) Object.entries(groupedArray).map((month, i) => {
const {
// key,
// value,
} = month;
log(`tab month key`, month[0], i)
log(`tab month value`, month[1], i)
})


array group by key javascript的更多相关文章

  1. how to group date array by month in javascript

    how to group date array by month in javascript https://stackoverflow.com/questions/14446511/most-eff ...

  2. 谷歌IAP:skusBundle array associated with key ITEM_ID_LIST cannot contain more than 20 items.

    这几天在接谷歌的支付,在拉谷歌商品列表的时候转菊花,长时间不返回(querySkuDetails),一开始以为因为IAP有key不对导致的,查了下发现没有问题. 再看logcat,发现了这行: Inp ...

  3. [JavaScript] Array.prototype.reduce in JavaScript by example

    Let's take a closer look at using Javascript's built in Array reduce function. Reduce is deceptively ...

  4. ExtJS学习-----------Ext.Array,ExtJS对javascript中的Array的扩展

    关于ExtJS对javascript中的Array的扩展.能够參考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 因为 ...

  5. 复习 Array,重学 JavaScript

    1 数组与对象 在 JavaScript 中,一个对象的键只能有两种类型:string 和 symbol.下文只考虑键为字符串的情况. 1.1 创建对象 在创建对象时,若对象的键为数字,或者由 字母+ ...

  6. ExtJS学习-----------Ext.Array,ExtJS对javascript中的Array的扩展(实例)

    (1)clean var arr = [1,2,null,3,'']; alert(Ext.Array.clean(arr)); //clean的对象:(value === null) || (val ...

  7. javascript数组去重 String字符串去掉两端空格 javascript Array二分法排序 比较 javascript 求和

    通过原形添加方法: ==================数组去重(对象去重法)======================= Array.prototype.unique=function(){ va ...

  8. JavaScript求数组Array的并集(javascript面试常见题目)

    var Utils = { joinArray:function(source,target){ for(var i = 0;i<source.length;i++){ var oa = sou ...

  9. Azure DevOps的variable group实现array和hashtable参数的传递

    Azure Devops中的variable group建议或者只能(?)添加string类型的value.基于此我们想在variable group实现array或者hashtable的传递的核心思 ...

随机推荐

  1. Python学习【第2篇】:基本数据类型

    基本数据类型 字符串 ---------n1 = "xiaoxing"   n2 = "admin"  n3 = "123"  n4 = & ...

  2. loj10008家庭作业

    题目描述 老师在开学第一天就把所有作业都布置了,每个作业如果在规定的时间内交上来的话才有学分.每个作业的截止日期和学分可能是不同的.例如如果一个作业学分为10 ,要求在6 天内交,那么要想拿到这 10 ...

  3. eclipse 断点调试方法

    1 Debug视图 1.1 线程堆栈视图 线程堆栈视图表示当前线程的堆栈,从中可以看出在运行哪些代码,并且整个调用过程,以及代码行号.分别介绍一下这几个按钮的含义.从左至右分别为: 1.表示当前实现继 ...

  4. JDBC连接Oracle实现增、删、改操作

    jsp页面的form表单 AddMentaction实现向数据新增数据操作 DeleteMent删除操作 UpdateMent修改操作 最近在做一个练习项目"在线考试系统",在将整 ...

  5. Python: 捕获正在运行的CMD窗口内容

    最近需要捕获已经在运行的CMD窗口内容,并且需要根据指定输出内容来判断下一步的行动(输入指定内容). 尝试了很多次后,想到一个思路: 通过inspect.exe来获取CMD窗口Name信息通过uiau ...

  6. js实现购物车左滑删除

    使用 js 和jquery动画实现购物车左滑,请引入jquery库,不然会报错哦! 首页编写页面,注意布局,滑动分成两部分,商品图片和信息放在一个布局,删除和移入收藏放在一起. 其中js用到了 tou ...

  7. Codeforces Round #673 (Div. 2) B. Two Arrays(数学)

    题目链接:https://codeforces.com/contest/1417/problem/B 题意 定义 $f(a)$ 为数组 $a$ 中满足: $i < j$ $a_i + a_j = ...

  8. F - To Add Which?

    Description There is an integer sequence with N integers. You can use 1 unit of cost to increase any ...

  9. Codeforces Round #693 (Div. 3) G. Moving to the Capital (图,dp)

    题意:有一张有向图,每个点的权值为点\(1\)到该点的最短距离(每条边的长度为\(1\)),对于一条路径,这条路径上最多只能有一条边,这条边起点的权值不小于终点,现在要求每个点能到达路径上的点的最小权 ...

  10. Broken robot CodeForces - 24D (三对角矩阵简化高斯消元+概率dp)

    题意: 有一个N行M列的矩阵,机器人最初位于第i行和第j列.然后,机器人可以在每一步都转到另一个单元.目的是转到最底部(第N个)行.机器人可以停留在当前单元格处,向左移动,向右移动或移动到当前位置下方 ...