javascript - 根据不同的时间过滤小时
问题描述
我想要一个应该接受对象数组的通用 javascript 函数。每个对象都有一个 hours 属性,它是一个数组,可以在下面的代码中看到。每小时显示每天的不同时间。现在我需要过滤时间。如果周一到周二的时间(从和到)相同,那么它应该显示:MT:9-5PM WT:9-9PM Sat-Sun:Closed 如果周一到周五的时间相同并且周六或周日不同,它应显示 MF:9-5 PM 和 Sat:9-9PM 和 sun:close。
我应该在数组中返回数据,以便我可以在 UI 中以以下格式显示。它应该返回数组但包含此数据,以便可以在前端使用循环轻松呈现。
例如:我在一个数组中给出两个对象。总的来说,我只想展示一次不同的时间。
解决方案
像这样的东西?
const myHours = myData.map(item => {
const aggHours = item.hours.reduce((aggArr, obj) => {
const len = aggArr.length;
const last = len - 1;
//console.log(len, obj, aggArr)
if (len == 0){
aggArr.push({...obj, dayStr: obj.day});
}
else if (aggArr[last].fromHour == obj.fromHour
&& aggArr[last].toHour == obj.toHour) {
aggArr[last].dayStr = aggArr[last].day + " - " + obj.day;
}
else {
aggArr.push({...obj, dayStr: obj.day});
}
return aggArr;
}, []);
return {id: item.id, aggHours: aggHours.map(elem => {
if (elem.closed){
return {day: elem.dayStr, time: 'closed'};
}
else {
return {day: elem.dayStr, time: elem.fromHour + ' - ' + elem.toHour};
}
})};
});
console.log(myHours);
<script id="loadData">
const myData = [
{
"phones":[
{
"id":"dealer/phones/phone_0?sales=department",
"dialIn":"8777931407",
"region":"+1",
"areaCode":"877",
"carrier":"793",
"subscriber":"1407",
"nodeUri":{
"query":"sales=department",
"params":{
"sales":"department"
},
"domainName":"dealer",
"modelName":"phones",
"instanceID":"phone_0"
}
}
],
"address":{
"street1":"2101 Pennsylvania Ave",
"street2":null,
"city":"Wilmington",
"state":"DE",
"country":"US",
"postalCode":"19806",
"latitude":39.7578416,
"longitude":-75.5688727,
"timeZone":"America/New_York",
"region":"NORTHEAST",
"county":"NEW CASTLE"
},
"id":"dealer/department/sales",
"displayName":"Sales By Appointment",
"name":"sales",
"email":"qacobaltsanitized@hotmail.com",
"phoneNumber":"8777931407",
"hours":[
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Monday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Tuesday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Wednesday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Thursday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Friday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Saturday"
},
{
"closed":true,
"fromHour":"Closed",
"toHour":"Closed",
"day":"Sunday"
}
],
"hoursOfOperationTitle":"Hours Of Operation",
"nodeUri":{
"query":"",
"domainName":"dealer",
"modelName":"department",
"instanceID":"sales"
}
}
,
{
"phones":[
{
"id":"dealer/phones/phone_0?service=department",
"dialIn":"3024828359",
"region":"+1",
"areaCode":"302",
"carrier":"482",
"subscriber":"8359",
"nodeUri":{
"query":"service=department",
"params":{
"service":"department"
},
"domainName":"dealer",
"modelName":"phones",
"instanceID":"phone_0"
}
}
],
"address":{
"street1":"2101 Pennsylvania Ave",
"street2":null,
"city":"Wilmington",
"state":"DE",
"country":"US",
"postalCode":"19806",
"latitude":39.7578416,
"longitude":-75.5688727,
"timeZone":"America/New_York",
"region":"NORTHEAST",
"county":"NEW CASTLE"
},
"dynamicAttr":{
"itemprop":"department",
"itemtype":"//schema.org/AutoRepair"
},
"displayNameAttr":{
"itemprop":"name"
},
"id":"dealer/department/service",
"displayName":"Service ",
"name":"service",
"email":"qacobaltsanitized@hotmail.com",
"phoneNumber":"3024828359",
"hours":[
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Monday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Tuesday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Wednesday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Thursday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Friday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Saturday"
},
{
"closed":true,
"fromHour":"Closed",
"toHour":"Closed",
"day":"Sunday"
}
],
"nodeUri":{
"query":"",
"domainName":"dealer",
"modelName":"department",
"instanceID":"service"
}
}
]
</script>
输出:
[
{
"id": "dealer/department/sales",
"aggHours": [
{
"day": "Monday - Saturday",
"time": "09:00 - 17:00"
},
{
"day": "Sunday",
"time": "closed"
}
]
},
{
"id": "dealer/department/service",
"aggHours": [
{
"day": "Monday - Saturday",
"time": "07:00 - 16:00"
},
{
"day": "Sunday",
"time": "closed"
}
]
}
]
第二个例子:
const myHours = myData.map(item => {
const aggHours = item.hours.reduce((aggArr, obj) => {
const len = aggArr.length;
const last = len - 1;
//console.log(len, obj, aggArr)
if (len == 0){
aggArr.push({...obj, dayStr: obj.day});
}
else if (aggArr[last].fromHour == obj.fromHour
&& aggArr[last].toHour == obj.toHour) {
aggArr[last].dayStr = aggArr[last].day + " - " + obj.day;
}
else {
aggArr.push({...obj, dayStr: obj.day});
}
return aggArr;
}, []);
return {id: item.id, aggHours: aggHours.map(elem => {
if (elem.closed){
return {day: elem.dayStr, time: 'closed'};
}
else {
return {day: elem.dayStr, time: elem.fromHour + ' - ' + elem.toHour};
}
})};
});
console.log(myHours);
<script id="loadData">
const myData = [
{
"phones":[
{
"id":"dealer/phones/phone_0?sales=department",
"dialIn":"8777931407",
"region":"+1",
"areaCode":"877",
"carrier":"793",
"subscriber":"1407",
"nodeUri":{
"query":"sales=department",
"params":{
"sales":"department"
},
"domainName":"dealer",
"modelName":"phones",
"instanceID":"phone_0"
}
}
],
"address":{
"street1":"2101 Pennsylvania Ave",
"street2":null,
"city":"Wilmington",
"state":"DE",
"country":"US",
"postalCode":"19806",
"latitude":39.7578416,
"longitude":-75.5688727,
"timeZone":"America/New_York",
"region":"NORTHEAST",
"county":"NEW CASTLE"
},
"id":"dealer/department/sales",
"displayName":"Sales By Appointment",
"name":"sales",
"email":"qacobaltsanitized@hotmail.com",
"phoneNumber":"8777931407",
"hours":[
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Monday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Tuesday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Wednesday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Thursday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Friday"
},
{
"closed":true,
"fromHour":"Closed",
"toHour":"Closed",
"day":"Saturday"
},
{
"closed":true,
"fromHour":"Closed",
"toHour":"Closed",
"day":"Sunday"
}
],
"hoursOfOperationTitle":"Hours Of Operation",
"nodeUri":{
"query":"",
"domainName":"dealer",
"modelName":"department",
"instanceID":"sales"
}
}
,
{
"phones":[
{
"id":"dealer/phones/phone_0?service=department",
"dialIn":"3024828359",
"region":"+1",
"areaCode":"302",
"carrier":"482",
"subscriber":"8359",
"nodeUri":{
"query":"service=department",
"params":{
"service":"department"
},
"domainName":"dealer",
"modelName":"phones",
"instanceID":"phone_0"
}
}
],
"address":{
"street1":"2101 Pennsylvania Ave",
"street2":null,
"city":"Wilmington",
"state":"DE",
"country":"US",
"postalCode":"19806",
"latitude":39.7578416,
"longitude":-75.5688727,
"timeZone":"America/New_York",
"region":"NORTHEAST",
"county":"NEW CASTLE"
},
"dynamicAttr":{
"itemprop":"department",
"itemtype":"//schema.org/AutoRepair"
},
"displayNameAttr":{
"itemprop":"name"
},
"id":"dealer/department/service",
"displayName":"Service ",
"name":"service",
"email":"qacobaltsanitized@hotmail.com",
"phoneNumber":"3024828359",
"hours":[
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Monday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Tuesday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Wednesday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Thursday"
},
{
"fromHour":"07:00",
"toHour":"11:00",
"day":"Friday"
},
{
"fromHour":"07:00",
"toHour":"11:00",
"day":"Saturday"
},
{
"fromHour":"07:00",
"toHour":"11:00",
"day":"Sunday"
}
],
"nodeUri":{
"query":"",
"domainName":"dealer",
"modelName":"department",
"instanceID":"service"
}
}
]
</script>
输出:
[
{
"id": "dealer/department/sales",
"aggHours": [
{
"day": "Monday - Friday",
"time": "09:00 - 17:00"
},
{
"day": "Saturday - Sunday",
"time": "closed"
}
]
},
{
"id": "dealer/department/service",
"aggHours": [
{
"day": "Monday - Thursday",
"time": "07:00 - 16:00"
},
{
"day": "Friday - Sunday",
"time": "07:00 - 11:00"
}
]
}
]
第三个例子:
const myHours = myData.map(item => {
const aggHours = item.hours.reduce((aggObj, obj) => {
const times = obj.fromHour + ' - ' + obj.toHour;
if (aggObj[times]){
aggObj[times].days.push(obj.day);
}
else {
aggObj[times] = {...obj, days: [obj.day]};
}
return aggObj;
}, {});
return {id: item.id, aggHours: Object.values(aggHours).map(elem => {
if (elem.closed){
return {day: elem.days, time: 'closed'};
}
else {
return {day: elem.days, time: elem.fromHour + ' - ' + elem.toHour};
}
})};
});
console.log(myHours);
<script id="loadData">
const myData = [
{
"phones":[
{
"id":"dealer/phones/phone_0?sales=department",
"dialIn":"8777931407",
"region":"+1",
"areaCode":"877",
"carrier":"793",
"subscriber":"1407",
"nodeUri":{
"query":"sales=department",
"params":{
"sales":"department"
},
"domainName":"dealer",
"modelName":"phones",
"instanceID":"phone_0"
}
}
],
"address":{
"street1":"2101 Pennsylvania Ave",
"street2":null,
"city":"Wilmington",
"state":"DE",
"country":"US",
"postalCode":"19806",
"latitude":39.7578416,
"longitude":-75.5688727,
"timeZone":"America/New_York",
"region":"NORTHEAST",
"county":"NEW CASTLE"
},
"id":"dealer/department/sales",
"displayName":"Sales By Appointment",
"name":"sales",
"email":"qacobaltsanitized@hotmail.com",
"phoneNumber":"8777931407",
"hours":[
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Monday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Tuesday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Wednesday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Thursday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Friday"
},
{
"closed":true,
"fromHour":"Closed",
"toHour":"Closed",
"day":"Saturday"
},
{
"fromHour":"09:00",
"toHour":"17:00",
"day":"Sunday"
}
],
"hoursOfOperationTitle":"Hours Of Operation",
"nodeUri":{
"query":"",
"domainName":"dealer",
"modelName":"department",
"instanceID":"sales"
}
}
,
{
"phones":[
{
"id":"dealer/phones/phone_0?service=department",
"dialIn":"3024828359",
"region":"+1",
"areaCode":"302",
"carrier":"482",
"subscriber":"8359",
"nodeUri":{
"query":"service=department",
"params":{
"service":"department"
},
"domainName":"dealer",
"modelName":"phones",
"instanceID":"phone_0"
}
}
],
"address":{
"street1":"2101 Pennsylvania Ave",
"street2":null,
"city":"Wilmington",
"state":"DE",
"country":"US",
"postalCode":"19806",
"latitude":39.7578416,
"longitude":-75.5688727,
"timeZone":"America/New_York",
"region":"NORTHEAST",
"county":"NEW CASTLE"
},
"dynamicAttr":{
"itemprop":"department",
"itemtype":"//schema.org/AutoRepair"
},
"displayNameAttr":{
"itemprop":"name"
},
"id":"dealer/department/service",
"displayName":"Service ",
"name":"service",
"email":"qacobaltsanitized@hotmail.com",
"phoneNumber":"3024828359",
"hours":[
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Monday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Tuesday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Wednesday"
},
{
"fromHour":"07:00",
"toHour":"16:00",
"day":"Thursday"
},
{
"fromHour":"07:00",
"toHour":"11:00",
"day":"Friday"
},
{
"fromHour":"07:00",
"toHour":"11:00",
"day":"Saturday"
},
{
"fromHour":"07:00",
"toHour":"11:00",
"day":"Sunday"
}
],
"nodeUri":{
"query":"",
"domainName":"dealer",
"modelName":"department",
"instanceID":"service"
}
}
]
</script>
输出:
[
{
"id": "dealer/department/sales",
"aggHours": [
{
"day": [
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Sunday"
],
"time": "09:00 - 17:00"
},
{
"day": [
"Saturday"
],
"time": "closed"
}
]
},
{
"id": "dealer/department/service",
"aggHours": [
{
"day": [
"Monday",
"Tuesday",
"Wednesday",
"Thursday"
],
"time": "07:00 - 16:00"
},
{
"day": [
"Friday",
"Saturday",
"Sunday"
],
"time": "07:00 - 11:00"
}
]
}
]
推荐阅读
- java - Maven 构建但不在 Cucumber 中执行测试
- python - Python:每 100 行大数据帧应用一次函数
- css - CSS 动画 (transform: rotateY(180deg);) 完美运行,除了 iOS 上的 Chrome
- php - Guzzle api调用执行时间太长,php中的foreach循环
- r - R中的科学记数法
- django-channels - Django Channels 方法语法
- kubernetes - 入口配置设置不会重定向到正确的页面
- reactjs - 在 React-Native 中渲染屏幕内容之前渲染底部标签动画。需要一个用于滞后动画的 Workarround
- javascript - 纯 Javascript 菜单晚餐提示作为输出,选择输入
- javascript - 如何使用 NodeJS 并行下载多个文件并在完成后执行回调?