JSFiddle - React, Tailwind, and code Playground

JavaScript

const periods = [
  { close: { day: 1, time: '1400' }, open: { day: 1, time: '1100' } },
  { close: { day: 1, time: '2200' }, open: { day: 1, time: '1900' } },
  { close: { day: 2, time: '1400' }, open: { day: 2, time: '1100' } },
  { close: { day: 2, time: '2200' }, open: { day: 2, time: '1900' } },
  { close: { day: 3, time: '1400' }, open: { day: 3, time: '1100' } },
  { close: { day: 3, time: '2200' }, open: { day: 3, time: '1900' } },
  { close: { day: 4, time: '1400' }, open: { day: 4, time: '1100' } },
  { close: { day: 4, time: '2200' }, open: { day: 4, time: '1900' } },
  { close: { day: 5, time: '1400' }, open: { day: 5, time: '1100' } },
  { close: { day: 5, time: '2200' }, open: { day: 5, time: '1900' } },
  { close: { day: 6, time: '2200' }, open: { day: 6, time: '1100' } },
];

const days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

const openingHours =
	periods.map(p => ({ 
  	day: p.open.day, 
    time: `${p.open.time} - ${p.close.time}`
  }))
  .reduce((acc, current) => {
  	let time = acc[current.day];
    time.push(current.time);
    return Object.assign([], acc, { [current.day]: time });
  }, days.map(d => []))
  .map((p, index) => {
  	const status = p.length == 0 ? "Closed" : p.join(" and ");
  	return `${days[index]}: ${status}`;
  });
  
 console.log(openingHours);