Array Access Issue

Question

I am trying to use a dynamically updated accessor for a javascript array inside of an object literal constructor. Both data and index variables are in the same functional scope.

var data = [];
var index = 0;

dateKeys.forEach(element=>{

data.push({"date":element,[otherKeys[0]]:currentAccount[index]["2017_Q1"],[otherKeys[1]]:0,[otherKeys[2]]:0,[otherKeys[3]]:0,[otherKeys[4]]:0,[otherKeys[5]]:0})
index = index +1;

})

The code above produces the following error message: TypeError: undefined is not an object (evaluating 'currentAccount[index]["2017_Q1"]')

Yet when I try:

 dateKeys.forEach(element=>{
 var index = 0;
 data.push({"date":element,[otherKeys[0]]:currentAccount[index]  ["2017_Q1"],[otherKeys[1]]:0,[otherKeys[2]]:0,[otherKeys[3]]:0,[otherKeys[4]]:0,[otherKeys[5]]:0})
index = index +1;

})

I get the correct data for index 0 but it does not update. Why does the scoping seem to make a difference here to the ability to use a variable name in place of a number in the square brackets? I have tried using let, to see if it was a binding issue, but that makes no difference. Is there a solution using vanilla javascript?

This example is incomplete--it's not clear what currentAccount, otherKeys or dateKeys are. See minimal reproducible example for help on how to write an answerable question. — ggorlen
– ggorlen, Commented Apr 6, 2019 at 20:25

Townsheriff · Accepted Answer · 2019-04-06 20:34:01Z

1

This is because you are declaring and initializing index variable each time when forEach callback is called.

For example if dateKeys has 5 items, then element => ... will be called 5 times and each time creating a new variable index and setting it's value 0.

In second case you are never accessing currentAccount with index value 1.

You are getting this error because dataKeys, has more entries than currentAccount.

answered Apr 6, 2019 at 20:34

Townsheriff

7098 silver badges16 bronze badges

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

Comments

Liren Yeo · Accepted Answer · 2019-04-06 20:51:25Z

1

var is function-scoped, which means your index gets hoisted to the top and out of the loop-block. Each time you loop through dataKeys, it will always be referencing the same hoisted index.

Use let to declare index inside forEach, or simply expose the index argument from forEach:

dateKeys.forEach((element, index) => {
  // use index here
})

answered Apr 6, 2019 at 20:51

Liren Yeo

3,4592 gold badges24 silver badges43 bronze badges

Comments

Jack Bashford · Accepted Answer · 2019-04-06 20:54:24Z

1

The problem is that you are declaring index every single time the loop runs - the code inside the function will be executed every time. You need to use the built-in forEach index parameter (the second one):

dateKeys.forEach((element, index) => {
    data.push({"date":element,[otherKeys[0]]:currentAccount[index]  ["2017_Q1"],[otherKeys[1]]:0,[otherKeys[2]]:0,[otherKeys[3]]:0,[otherKeys[4]]:0,[otherKeys[5]]:0});
});

answered Apr 6, 2019 at 20:54

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

Collectives™ on Stack Overflow

Array Access Issue

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related