During the final iteration, the Array forEach method is replacing the value of an object

Question

During the final iteration, the Array forEach method is replacing the value of an object

Currently, I am iterating through an array of file names, breaking down the names, and saving the information in an object. For testing purposes, there are two file names that are almost identical except for the week "number" which should represent different weeks. However, I encountered a problem where the first entry is getting overwritten by the last iteration, resulting in only one entry for week 2.

This is the code snippet:

const planList = [
    'military_greekHero_achilles_week_1.htm',
    'military_greekHero_achilles_week_2.htm'
];

var _completePlan = {};

planList.forEach(_plan => {

// Extract data from the file name format: target_series_title_overview/week_weekNum.htm
    let _planPieces = _plan.split('.')[0].split('_'), // Remove the .htm
        _planTarget = _planPieces[0],
        _planSeries = _planPieces[1],
        _planTitle = _planPieces[2],
        _planOverview = _planPieces[3],
        _planWeek = _planPieces[4];

    _planOverview = _planOverview == 'overview' ? true : false;
    
// Start Building Plan Object
    _completePlan[_planTitle] = {
        info: {},
        weeks: {}
    }

// While iterating, _planWeek logs 1 and 2 but the entry for .weeks.1 gets replaced with .weeks.2
    _completePlan[_planTitle].weeks[_planWeek] = {
        sn: { inactive: true },
        mo: { inactive: true },
        tu: { inactive: true },
        we: { inactive: true },
        th: { inactive: true },
        fr: { inactive: true },
        st: { inactive: true }
    }
});

console.log(_completePlan);
});

I believe there might be a simple solution that I'm missing... any suggestions?

javascript arrays foreach

Answer 1

Answer №1

Before creating the object, it is important to check if it already exists to avoid overwriting the previous one:

if (!_completePlan.hasOwnProperty(_planTitle)) {
    _completePlan[_planTitle] = {
      info: {},
      weeks: {}
    }
  }

In addition, a restructuring statement has been included to streamline the code:

let [_planTarget, _planSeries, _planTitle, _planO, _planWeek] = _plan.split('.')[0].split('_'), // Remove the .htm
_planOverview = _planO === 'overview' ? true : false;

const planList = [
  'military_greekHero_achilles_week_1.htm',
  'military_greekHero_achilles_week_2.htm'
];

var _completePlan = {};

planList.forEach(_plan => {

  // Extracting data from the file name format: target_series_title_overview/week_weekNum.htm
  let [_planTarget, _planSeries, _planTitle, _planO, _planWeek] = _plan.split('.')[0].split('_'), // Remove the .htm
    _planOverview = _planO === 'overview' ? true : false;

  // Begin Building Plan Object
  if (!_completePlan.hasOwnProperty(_planTitle)) {
    _completePlan[_planTitle] = {
      info: {}, weeks: {}
    }
  }

  _completePlan[_planTitle].weeks[_planWeek] = {
    sn: { inactive: true},
    mo: { inactive: true},
    tu: { inactive: true},
    we: { inactive: true},
    th: { inactive: true},
    fr: { inactive: true},
    st: { inactive: true}
  }
});

console.log(_completePlan);

Answer 2

Before creating the object, it is important to check if it already exists to avoid overwriting the previous one:

if (!_completePlan.hasOwnProperty(_planTitle)) {
    _completePlan[_planTitle] = {
      info: {},
      weeks: {}
    }
  }

In addition, a restructuring statement has been included to streamline the code:

let [_planTarget, _planSeries, _planTitle, _planO, _planWeek] = _plan.split('.')[0].split('_'), // Remove the .htm
_planOverview = _planO === 'overview' ? true : false;

const planList = [
  'military_greekHero_achilles_week_1.htm',
  'military_greekHero_achilles_week_2.htm'
];

var _completePlan = {};

planList.forEach(_plan => {

  // Extracting data from the file name format: target_series_title_overview/week_weekNum.htm
  let [_planTarget, _planSeries, _planTitle, _planO, _planWeek] = _plan.split('.')[0].split('_'), // Remove the .htm
    _planOverview = _planO === 'overview' ? true : false;

  // Begin Building Plan Object
  if (!_completePlan.hasOwnProperty(_planTitle)) {
    _completePlan[_planTitle] = {
      info: {}, weeks: {}
    }
  }

  _completePlan[_planTitle].weeks[_planWeek] = {
    sn: { inactive: true},
    mo: { inactive: true},
    tu: { inactive: true},
    we: { inactive: true},
    th: { inactive: true},
    fr: { inactive: true},
    st: { inactive: true}
  }
});

console.log(_completePlan);

Answer 3

Answer №2

In each iteration, you are resetting the entirety of _completePlan[_planTitle]. This means that the objects 1 or 2 within the weeks object are not being "overridden," but rather their grandparent object is being set back to {info: {}, weeks: {}}.

To resolve this issue, you should check if the weeks object exists and only assign it to itself if it does; otherwise, assign it to an empty object.

Here's how you can achieve that:

const planList = [
    'military_greekHero_achilles_week_1.htm',
    'military_greekHero_achilles_week_2.htm'
];

var _completePlan = {};


planList.forEach(_plan => {

        // Extracting data from the file name format: target_series_title_overview/week_weekNum.htm
            let _planPieces = _plan.split('.')[0].split('_'),// Remove .htm
                _planTarget = _planPieces[0],
                _planSeries = _planPieces[1],
                _planTitle = _planPieces[2],
                _planOverview = _planPieces[3],
                _planWeek = _planPieces[4];

            _planOverview = _planOverview == 'overview' ? true : false;

            
        // Building Plan Object
            

        // While iterating, _planWeek logs 1 and 2, but the entry for .weeks.1 is replaced by .weeks.2
            _completePlan[_planTitle] = _completePlan[_planTitle] || {};
            _completePlan[_planTitle].info = _completePlan[_planTitle].info || {};
            _completePlan[_planTitle].weeks = _completePlan[_planTitle].weeks || {};


            _completePlan[_planTitle].weeks[_planWeek] = {
                sn: { inactive: true },
                mo: { inactive: true },
                tu: { inactive: true },
                we: { inactive: true },
                th: { inactive: true },
                fr: { inactive: true },
                st: { inactive: true }
    }
});
console.log(_completePlan);

Answer 4

In each iteration, you are resetting the entirety of _completePlan[_planTitle]. This means that the objects 1 or 2 within the weeks object are not being "overridden," but rather their grandparent object is being set back to {info: {}, weeks: {}}.

To resolve this issue, you should check if the weeks object exists and only assign it to itself if it does; otherwise, assign it to an empty object.

Here's how you can achieve that:

const planList = [
    'military_greekHero_achilles_week_1.htm',
    'military_greekHero_achilles_week_2.htm'
];

var _completePlan = {};


planList.forEach(_plan => {

        // Extracting data from the file name format: target_series_title_overview/week_weekNum.htm
            let _planPieces = _plan.split('.')[0].split('_'),// Remove .htm
                _planTarget = _planPieces[0],
                _planSeries = _planPieces[1],
                _planTitle = _planPieces[2],
                _planOverview = _planPieces[3],
                _planWeek = _planPieces[4];

            _planOverview = _planOverview == 'overview' ? true : false;

            
        // Building Plan Object
            

        // While iterating, _planWeek logs 1 and 2, but the entry for .weeks.1 is replaced by .weeks.2
            _completePlan[_planTitle] = _completePlan[_planTitle] || {};
            _completePlan[_planTitle].info = _completePlan[_planTitle].info || {};
            _completePlan[_planTitle].weeks = _completePlan[_planTitle].weeks || {};


            _completePlan[_planTitle].weeks[_planWeek] = {
                sn: { inactive: true },
                mo: { inactive: true },
                tu: { inactive: true },
                we: { inactive: true },
                th: { inactive: true },
                fr: { inactive: true },
                st: { inactive: true }
    }
});
console.log(_completePlan);

During the final iteration, the Array forEach method is replacing the value of an object

Answer №1

Answer №2

Similar questions

The error message "The specified type '(key: String, value: Any)' does not contain any subscript members" is being displayed

Discover the steps to capture the ajax initiation and completion events

Differences between Angular JS Objects and Arrays

What causes addEventListener to not return a value?

Transform array into object in php - Transform the given array into an object using php

Manipulate CSS Properties with Javascript Based on Dropdown Selection

Maintain the fancybox open even in case of ajax errors

Check an image preview prior to uploading through FileReader, rotates the image

Modify the hue of the div as soon as a button on a separate webpage is

Using JavaScript to define an array of objects

Looking to run a JavaScript command without the need for any triggering events?

The Autocomplete feature from the @react-google-maps/api component seems to be malfunctioning as it returns

"The authentication cookie fields are not defined when trying to get the authentication in the Express framework

What exactly does the 'app://' scheme entail when it comes to assets within Webpack-5-generated applications during development mode?

Adjusting the filter location in React-admin

Is it possible to conditionally call the Apollo Client in my Vue template script?

Trigger the activation of an input field upon clicking an image labeled "edit"

Tips for adding values to an array using an arrow function

Ways to apply Position Fixed to a particular Div element and subsequently eliminate that class while scrolling

Is it necessary to exclude the 'scripts' folder from your Aurelia project's .gitignore file?