Guide to transforming an array into a custom JavaScript object illustrating designated names for each key

Question

Guide to transforming an array into a custom JavaScript object illustrating designated names for each key

Trying to utilize JavaScript to transform the given array into a JavaScript object, but unsure of the process.

The input array is structured such that each key corresponds to a day of the week (Sunday to Saturday); where key 0 represents Sunday, key 1 represents Monday, and so forth up to key 6 representing Saturday.

var times = [["8:30-12:00","14:00-18:00"],
["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],
["9:00-21:00"],[],[]];

The goal is to convert the above times array into the following JavaScript object:

timeObj = {
  sunday: [
    {
      start: '08:30',
      stop: '12:00'
    },
    {
      start: '14:00',
      stop: '18:00'
    }
  ],
  monday: [
    {
      start: '06:15',
      stop: '9:30'
    },
    {
      start: '13:00',
      stop: '16:00'
    },
    {
      start: '20:00',
      stop: '23:15'
    }
  ],
  tuesday: [],
  wednesday: [
    {
       start: '9:00',
       stop: '21:00'
    }
  ],
  thursday:  [
    {
       start: '9:00',
       stop: '21:00'
    }
  ],
  friday:  [],
  saturday:  []
};

What is the recommended method to achieve this transformation from the times array to the timeObj object?

javascript arrays javascript-objects

Answer 1

Answer №1

To efficiently organize the schedule, you can use an array to represent each day and then iterate through it. During each iteration, you can add the corresponding day's time range to a result object.

var times = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
var days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
var result = {};

days.forEach((day, index) => {
  result[day] = times[index]
    .map(item => {
      let [start, stop] = item.split('-');
      return {start, stop};
    });
});

console.log(result);

Answer 2

To efficiently organize the schedule, you can use an array to represent each day and then iterate through it. During each iteration, you can add the corresponding day's time range to a result object.

var times = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
var days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
var result = {};

days.forEach((day, index) => {
  result[day] = times[index]
    .map(item => {
      let [start, stop] = item.split('-');
      return {start, stop};
    });
});

console.log(result);

Answer 3

Answer №2

If you want to optimize your code for managing 1-level lists, consider using Array.prototype.reduce. For 2-level lists, utilizing Array.prototype.map can help streamline the process of creating custom arrays within an object:

const data = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
const days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];

const result = data.reduce((acc, item, index) => { 
  acc[days[index]] = 
    item.map(day => ({ 
      start: day.substr(0, day.indexOf('-')), 
      end: day.substring(day.indexOf('-') + 1)
    }));
  return acc;
 }, {});

Answer 4

If you want to optimize your code for managing 1-level lists, consider using Array.prototype.reduce. For 2-level lists, utilizing Array.prototype.map can help streamline the process of creating custom arrays within an object:

const data = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
const days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];

const result = data.reduce((acc, item, index) => { 
  acc[days[index]] = 
    item.map(day => ({ 
      start: day.substr(0, day.indexOf('-')), 
      end: day.substring(day.indexOf('-') + 1)
    }));
  return acc;
 }, {});

Answer 5

Answer №3

Latest Update

This post contains a detailed discussion on software design and mathematics in providing the final answers at the top for easy reference.

Recommended Answer (for readability):

var times = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
var days = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];

var timeObj = {};

for (var i = 0; i < times.length; i++)
{
    // Initialize an empty array:
    timeObj[days[i]] = [];

    // Add each timespan from the original array to this day
    for (var j = 0; j < times[i].length; j++)
    {
        var timespan = times[i][j];

        // Parse the string
        var timespanArr = timespan.split("-");
        var timespanObj = {
            start: ("0" + timespanArr[0]).substr(-5),
            end: ("0" + timespanArr[1]).substr(-5)
        };

        // Append to the respective day
        timeObj[days[i]].push(timespanObj);
    }
}

console.log(timeObj);

Compact Answer:

var times = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
var start, end;
var obj = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"].reduce((acc, el, idx) => (
    acc[el] = times[idx].map(span => (
        [start, end] = span.split("-"), {start, end}
    )), acc
), {});

The Challenge

While attempting to address two unique problems, it's essential to focus on:

Mapping indices to keys accurately
Parsing the given strings effectively

Creating understandable and easily maintainable code is key. Always prioritize human-readable code over complex one-liners for smooth future maintenance and development.

In Summary

Addressing software intricacies with clarity will lead to efficient coding practices and better outcomes. Stay focused on simplifying solutions and optimizing readability for long-term success in programming endeavors.

Answer 6

Latest Update

This post contains a detailed discussion on software design and mathematics in providing the final answers at the top for easy reference.

Recommended Answer (for readability):

var times = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
var days = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];

var timeObj = {};

for (var i = 0; i < times.length; i++)
{
    // Initialize an empty array:
    timeObj[days[i]] = [];

    // Add each timespan from the original array to this day
    for (var j = 0; j < times[i].length; j++)
    {
        var timespan = times[i][j];

        // Parse the string
        var timespanArr = timespan.split("-");
        var timespanObj = {
            start: ("0" + timespanArr[0]).substr(-5),
            end: ("0" + timespanArr[1]).substr(-5)
        };

        // Append to the respective day
        timeObj[days[i]].push(timespanObj);
    }
}

console.log(timeObj);

Compact Answer:

var times = [["8:30-12:00","14:00-18:00"],["6:15-9:30","13:00-16:00","20:00-23:15"],[],["9:00-21:00"],["9:00-21:00"],[],[]];
var start, end;
var obj = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"].reduce((acc, el, idx) => (
    acc[el] = times[idx].map(span => (
        [start, end] = span.split("-"), {start, end}
    )), acc
), {});

The Challenge

While attempting to address two unique problems, it's essential to focus on:

Mapping indices to keys accurately
Parsing the given strings effectively

Creating understandable and easily maintainable code is key. Always prioritize human-readable code over complex one-liners for smooth future maintenance and development.

In Summary

Addressing software intricacies with clarity will lead to efficient coding practices and better outcomes. Stay focused on simplifying solutions and optimizing readability for long-term success in programming endeavors.

Answer 7

Answer №4

Here is the solution:

let dayList = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday']

let workingHours = [
  ["8:30-12:00", "14:00-18:00"],
  ["6:15-9:30", "13:00-16:00", "20:00-23:15"],
  [],
  ["9:00-21:00"],
  ["9:00-21:00"],
  [],
  []
]

const schedule = {}
for (let index = 0; index < 7; index++) {
  const timeSlots = []
  schedule[dayList[index]] = timeSlots
  workingHours[index].forEach(interval => {
    const parts = interval.split('-')
    timeSlots.push({
      startTime: parts[0],
      endTime: parts[1]
    })
  })
}
console.log(schedule);

Answer 8

Here is the solution:

let dayList = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday']

let workingHours = [
  ["8:30-12:00", "14:00-18:00"],
  ["6:15-9:30", "13:00-16:00", "20:00-23:15"],
  [],
  ["9:00-21:00"],
  ["9:00-21:00"],
  [],
  []
]

const schedule = {}
for (let index = 0; index < 7; index++) {
  const timeSlots = []
  schedule[dayList[index]] = timeSlots
  workingHours[index].forEach(interval => {
    const parts = interval.split('-')
    timeSlots.push({
      startTime: parts[0],
      endTime: parts[1]
    })
  })
}
console.log(schedule);

Guide to transforming an array into a custom JavaScript object illustrating designated names for each key

Answer №1

Answer №2

Answer №3

Latest Update

The Challenge

In Summary

Answer №4

Similar questions

The routing in CakePhp 2.x seems to be malfunctioning

In React JSX, what is the best approach for printing a substring?

Deciphering a JSON array by value or key

Are the types identical but require direct conversion?

A guide on using Jest.js to test labels within Vue 3 Quasar components by utilizing a forEach loop

Looking to conceal a JavaScript file or minimize it from the web browser following production build in React

What is the method for graphing data points that include two different y values?

Is it necessary to conceal the element every time the jQuery slideDown function is utilized?

Ways to conceal a message button on a website when a user logs out

Select the correct nested div with the same name by clicking on it

JavaScript: for each element in the array, print the current value

Steps to deactivate a ladda button

Discover the method to retrieve HTML content by sending an HTTP POST request in AngularJS, similar to loading content

Images showing Strava heat maps retrieved through API

Guide on inserting data into a table using a multidimensional array

Comparing the use of malloc for initializing a char pointer versus directly assigning a string to the char pointer

Display tab content in Vue.js upon clicking

What distinguishes declaring an array within int main() from declaring it outside int main()?

What are the different techniques for implementing React-Redux? Comparing Redux-thunk and Redux-Saga

Having trouble displaying results in Vue.js after making an API request?