Array undefined outside of javascript function?

Question

I've defined a function in React-Native that gets an object from Firebase and pushes its contents onto an array. However, although the array is being populated fine after my call to 'push', it is undefined at the end of the for loop. I have no idea why it's being cleared, as I'm defining the array outside of the for loop, so I thought I'd ask for an extra pair of eyes in case I'm missing anything.

    var newList = [];
    var arrayLength = userArray.length;
    for (var i = 0; i < arrayLength; i++) {

        var userRef = usersRef.child(userArray[i]);
        userRef.once('value', function(snap) {
            newList.push({
                name: snap.val().name,
                description: snap.val().description,
            });
            //this log statement prints out correct array
            console.log("NEWLIST" + newList[i]);
        });
        //but array is undefined here
        console.log("NEWLIST 2" + newList[i]);
    }
    this.setState({
        current: this.state.current.cloneWithRows(newList),
        past: this.state.past.cloneWithRows(oldList)
    });

The array is not being cleared, it's just not populated yet when you log NEWLIST 2. The data is loaded asynchronously and your code is (luckily for the user) not waiting for the result. Your logging should show that by the order in which they appear: NEWLIST 2 and only then NEWLIST. For a good explanation of this phenomenon, see stackoverflow.com/questions/14220321/… — Frank van Puffelen
– Frank van Puffelen, Commented May 1, 2016 at 15:21
Why is my variable unaltered after I modify it inside of a function? and JavaScript closure inside loops — Jonathan Lonowski
– Jonathan Lonowski, Commented May 1, 2016 at 15:24

Prashant Agrawal · Accepted Answer · 2016-05-01 15:23:19Z

1

The code looks fine but what I think might be happening here is that userRef.once() is an async call, and your outer console.log is getting executed first. And when the event triggers the callback your inner console.log() prints the value

answered May 1, 2016 at 15:23

Prashant Agrawal

67010 silver badges25 bronze badges

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

Comments

Robert Moskal · Accepted Answer · 2016-05-01 15:21:24Z

1

Read up on JavaScript's asynchronous nature. The once function takes a callback. The console.log in the outer scope is executed before you push any items info your array.

answered May 1, 2016 at 15:21

Robert Moskal

22.7k8 gold badges69 silver badges91 bronze badges

Collectives™ on Stack Overflow

Array undefined outside of javascript function?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related