Accessing properties from object in `for`–`in` loop results in `undefined`

Question

I have these two classes:

class Node {
    constructor(nodeId){
        this.nodeId = nodeId;
        this.adjacencies = [];
    }

    connectToNode(nodeToConnectTo){
        this.adjacencies.push(nodeToConnectTo);
    }
}

class Graph{
    constructor(nodes){
        this.nodes = nodes;
    }

    printGraph(){
        for (let node in this.nodes){
            console.log(node.nodeId);
        }
        
    }
}

I’m simply trying to call printGraph to print all the nodeIds this way:

let node1 = new Node('1');
let node2 = new Node('2');
let node3 = new Node('3');
const arr = [node1, node2, node3];
let graph = new Graph(arr);

graph.printGraph();

But it’s printing undefined. I can’t seem to figure out why it isn’t simply printing the nodeId.

Does this answer your question? [What is the difference between ( for... in ) and ( for... of ) statements in JavaScript?](https://stackoverflow.com/questions/29285897/what-is-the-difference-between-for-in-and-for-of-statements-in-jav) — Ivar, Dec 03 '20 at 12:40

score 0 · Answer 1 · answered Dec 03 '20 at 12:45

0

I think the problem may be that you are using "for in" loop instead of "for of" to iterate over an array.

"for in" loop is used to iterate object properties

answered Dec 03 '20 at 12:45

Francesco Vertemati

81
6

score 0 · Accepted Answer · answered Dec 03 '20 at 12:48

0

you are using the wrong for loop. Try changing it to:

printGraph(){
  for (let node of this.nodes){
    console.log(node.nodeId);
  }   
}

A for..of loop should loop over the node the way you want.
Result:

1
2
3

answered Dec 03 '20 at 12:48

Stephan Bakkelund Valois

992
1
9
23

score 0 · Answer 3 · edited Dec 03 '20 at 13:06

It seems you're iterating over the properties of the array object by using the in keyword. For an array, this means you're iterating over the indices (keys), namely 0, 1, 2 in your 3-member array. Those are strings, and don't have a nodeId property, so your output is undefined. You'll see these if you run console.log(node, typeof node) inside your current loop (staying with in).

If you use the of keyword in your for loop, you'll get the values of the array, namely the objects with 1, 2 and 3 as values for nodeId. So all you have to do is change the in to of and you'll have the output you're after.

Personally, I'd use this:

printGraph(){
    const nodeIds = this.nodes.map(node => node.nodeId);
    console.log(nodeIds);
}

See [Should I remove 'fluff' when editing questions?](https://meta.stackoverflow.com/questions/260776/should-i-remove-fluff-when-editing-questions) and [Should 'Hi', 'thanks', taglines, and salutations be removed from posts?](https://meta.stackexchange.com/questions/2950/should-hi-thanks-taglines-and-salutations-be-removed-from-posts) — Ivar, Dec 03 '20 at 13:11

score -1 · Answer 4 · answered Dec 03 '20 at 12:42

-1

you need to print console.log(node); cause you are looping trough let node in this.nodes

where node is an actual node from this.nodes

answered Dec 03 '20 at 12:42

Ng Atom

95
7

"_where `node` is an actual node from `this.nodes`_" No, it isn't. `node` in this case is the key/index of the element in the array. – Ivar Dec 03 '20 at 12:45

Accessing properties from object in `for`–`in` loop results in `undefined`

4 Answers4