JavaScript property duplicates [dot vs bracket]…

Question

I have an issue where I try to count combinations. I try to solve it with JavaScript, but have some issues... Example for the different sets:

var colors    = ["Yellow", "Blue"];
var decisions = ["Yes", "No"];

As a first step I create an empty object and try to fill it with the two arrays and initialize a counter for each combination:

var myObject = {};
for ( colorIndex in colors ) {
   myObject[colors[colorIndex]] = {};
   for ( decisionIndex in decisions ) {
      myObject[color][decisions[decisionIndex]] = 0;
   }
}

In a next step I try to count results I got - Example:

var color = "Yellow";
var decision = "Yes";
myObject[color][decision] += 1;

Debugging (what I tried)

However, the result I am getting is something like:

Yellow: {Yes: 0, No: 0, Yes: NaN}

When I try to debug whats happening then I make the observation that the variables shortcodes are as follows:

myObject.Yellow.Yes    = 0
myObject.Yellow.No     = 0
myObject.Yellow["Yes"] = NaN

At this point I am not sure if I left away anything important, but does anyone of you know whats going on? I thought the brackets and dot-notation should be equivalent, even though I don't know how the dot-notation has been created here, since Yes and No were strings...

Can you pinpoint me in a direction?

Thanks for reading this.

Edit: Change to forEach-loop:

Based on recommendations I changed the loop to:

var myObject = {};
colors.forEach(function(color) {
   myObject[color] = {};
   decisions.forEach(function(decision) {
      myObject[color][decision] = 0;
   });
});

However, the problem remains that I get the NaN-case

Is it only the count of combinations you want to get or do you also want to have the arrays combined? — Arman Ozak, Mar 13 '16 at 07:24
Do not use `for..in` to iterate an array. Please see [`this`](http://stackoverflow.com/questions/3010840/loop-through-array-in-javascript). — BatScream, Mar 13 '16 at 07:25
the code you supply isn't valid. when you do `for item in arr` the item will be the indexes of the array — Zamboney, Mar 13 '16 at 07:25
Note that you should not use *for..in* over arrays as you may not get properties in the order you expect and you may get other properties. — RobG, Mar 13 '16 at 08:12
I'm going to switch to the forEach and let you know how it works. — skofgar, Mar 13 '16 at 16:09

score 2 · Answer 1 · answered Mar 13 '16 at 07:27

i modify your code as bellow, and works fine , the problem is the way you use for in
also you have wrong code on for ( decisions in decision ) that should be for ( decision in decisions )

var colors    = ["Yellow", "Blue"];
var decisions = ["Yes", "No"];

var myObject = {};
for ( color in colors ) {
   myObject[colors[color]] = {};
   for ( decision in decisions ) {
      myObject[colors[color]][decisions[decision]] = 0;
   }
}

var color = "Yellow";
var decision = "Yes";
myObject[color][decision] += 1;

Thanks for pointing that out. That's exactly what I have in my code, but when I generalized it, to post it here, I did that silly mistake again. — skofgar, Mar 13 '16 at 16:02

Manish Kumar · Answer 2 · 2016-03-13T07:34:24.767

1

Dude, typo error in your second loop. You have written

decisions in decision

Whereas, it should be

decision in decisions

Everything ia fine.

edited Mar 13 '16 at 07:34

answered Mar 13 '16 at 07:27

Manish Kumar

1,131
15
28

Thanks! That's not the actual problem I have, I just posted that part wrong here. I fixed it, but my Problem with two "yes" still remains... :/ – skofgar Mar 13 '16 at 16:03

score 0 · Answer 3 · answered Mar 13 '16 at 09:14

0

Try

var myObject = {};
colors.forEach(function(color){
myObject[color] = {};
 decisions.forEach(function(decision){
   myObject[color][decision] = 0;
  })
})

As colors and decisions are arrays, you should not use for-in to loop through

answered Mar 13 '16 at 09:14

Kishore Barik

742
3
15

I'm going to try that and let you know if it resolves the issue. – skofgar Mar 13 '16 at 16:09
It wasn't that issue, but thank you for your input! (See my Answer for what it was.. - it was very stupid -.-') – skofgar Mar 13 '16 at 19:06

score 0 · Accepted Answer · edited May 23 '17 at 11:45

With stringify - A hidden line-break.

I continued reading and found this post here.

By stringify-ing my two inputs color and decision I noticed that they are not "equal" in a way they seemed by just logging it to the console, it turns out that one of them had a line-break in it (\r)...

JSON.stringify(color)
> "\"Yellow"\"

JSON.stringify(decision)
> "\"Yes\r\""

I know that, that was not clear from how I asked the question, and my example would not have allowed you to reveal that.

I'm going to do some research on how to get rid of that, but I think it should be fairly simple.

Sorry my question wasn't that clear, but I did not expect that this was the reason. Thank you very much for your help though. Very appreciated!

great... you found the root cause – Kishore Barik Mar 14 '16 at 06:23 — Kishore Barik, Mar 14 '16 at 06:23

JavaScript property duplicates [dot vs bracket]…

Edit: Change to forEach-loop:

4 Answers4

With stringify - A hidden line-break.