Issue populating an array of objects dynamically in javascript

Question

I am facing an issue when populating an array of the object dynamically in javascript. I have this sample data as below:

I have to populate following arrays with the data from above:

c1_Arr = [];
c2_Arr = [];

var torontoObj = { arName: 'تورونتو', enName: 'Totonto', value: 0 };
var parisObj = { arName: 'باريس', enName: 'Paris', value: 0 };
var londonObj = { arName: 'لندن', enName: 'London', value: 0 };

Now I am looping through the data to set the values from data as:

var resultCount = results.features.length;
for (var i = 0; i < resultCount; i++) {
    var data = results.features[i].attributes;

    parisObj.value = data.Paris;
    londonObj.value = data.London;
    torontoObj.value = data.Toronto;

    if (data.Ind_ID === 101) {
        c1_Arr.push(parisObj);
        c1_Arr.push(londonObj);
        c1_Arr.push(torontoObj);
    }
}
console.log(c1_Arr);

I am getting this data in console:

Here I am getting the values of the object i.e. Ind_ID = 102 instead of the object values of Ind_ID = 101 (first object).

How to get the values of the required object using the Ind_ID?

Please help potential answeres by posting an example of what you expect the result of your function to look like. Also post the actual values of the input data, not just a screenshot, so it can be copied into a code snippet. — AndreasPizsa
– AndreasPizsa, Commented Nov 12, 2019 at 6:22

mirimad · Accepted Answer · 2019-11-12 06:31:37Z

4

The problem is because even though you have the if condition there but you are updating the value of the objects in the loop and since you have already pushed them objects you still have the reference in the main objects. They get overwritten.

Create the 3 objects (torontoObj, etc.) inside the loop.

edited Nov 12, 2019 at 6:31

answered Nov 12, 2019 at 6:25

mirimad

964 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vikash Tiwari Over a year ago

Something like this

var resultCount = results.features.length; for (var i = 0; i < resultCount; i++) {     var data = results.features[i].attributes;      if (data.Ind_ID === 101) {         parisObj.value = data.Paris;         londonObj.value = data.London;         torontoObj.value = data.Toronto;         c1_Arr.push(parisObj);         c1_Arr.push(londonObj);         c1_Arr.push(torontoObj);     } } console.log(c1_Arr);

Vikash Tiwari · Accepted Answer · 2019-11-12 06:34:17Z

1

Reference is getting updated in the second iteration (where Ind_ID is 102)

You should rather do

var resultCount = results.features.length;
for (var i = 0; i < resultCount; i++) {
    var data = results.features[i].attributes;

    if (data.Ind_ID === 101) {
        parisObj.value = data.Paris;
        londonObj.value = data.London;
        torontoObj.value = data.Toronto;
        c1_Arr.push(parisObj);
        c1_Arr.push(londonObj);
        c1_Arr.push(torontoObj);
    }
}
console.log(c1_Arr);

answered Nov 12, 2019 at 6:34

Vikash Tiwari

1131 silver badge10 bronze badges

Comments

Harshith Rai · Accepted Answer · 2019-11-12 08:35:19Z

1

Your object values are getting updated even after being set inside the if loop, simply because, you're not limiting it from being updated.

You could probably do one of the following 2 things:

The simpler one:

Extract the values of Paris, London and Toronto fields of data only if the Ind _ID is 101.

like this:

var resultCount = results.features.length;
for (var i = 0; i < resultCount; i++) {
    var data = results.features[i].attributes;

    if (data.Ind_ID === 101) {
        parisObj.value = data.Paris;
        londonObj.value = data.London;
        torontoObj.value = data.Toronto;
        c1_Arr.push(parisObj);
        c1_Arr.push(londonObj);
        c1_Arr.push(torontoObj);
    }
}
console.log(c1_Arr);

The more elegant one:

Extract the array element which only matches your condition, in other words filter.

    var resultCount = results.features.length;
    var data = results.features.filter(feature => feature.attributes.Ind_ID === 101);
    parisObj.value = data[0].Paris;
    londonObj.value = data[0].London;
    torontoObj.value = data[0].Toronto;
    console.log(c1_Arr);

edited Nov 12, 2019 at 8:35

answered Nov 12, 2019 at 6:36

Harshith Rai

3,1067 gold badges25 silver badges37 bronze badges

2 Comments

mirimad Over a year ago

The second one is wrong as its iterating the same thing again and again. You can ditch the for loop and do the inner code directly. But then there is a chance if the id doesn't exist.

Harshith Rai Over a year ago

oh yeah.. thanks for pointing it out.. Overlooked it while copying the code.. Thanks a lot

Collectives™ on Stack Overflow

Issue populating an array of objects dynamically in javascript

3 Answers 3

1 Comment

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related