Unable To Retrieve Data From Cloud Firestore Using Queries

I am attempting to retrieve a collection of data from my Cloud Firestore, so that I can arrange the data in a 'Bootstrap' Table, displaying the name and the score from the Firestor

Solution 1:

Note for potential readers: the fist part of the answer corresponds to the initial question of the OP, before it was edited.

You have to put the second part of your code within the then() function, as below. This is because get() returns "a promise that will be resolved with the results of the query." (see the Ref https://firebase.google.com/docs/reference/js/firebase.firestore.CollectionReference#get)

var usersCollectionRef = db.collection("users"); //Creates a reference to the Users collection

var query = usersCollectionRef.where("name", "==", "Steeve"); //Creates a query based on the collection

query.get().then(function(querySnapshot) { //Call get() to get a QuerySnapshot

            if (querySnapshot.empty) { //Check whether there are any documents in the result
                console.log('no documents found');
            } else {
                    querySnapshot.docs.map(function (documentSnapshot) {
                        //Not necessary to do that  -> return documentSnapshot.data();
                        console.log(documentSnapshot.data().name); 
                    });
            }

});

---

EDIT following your comment:

In case you would have several documents for a given name which hold a different score (in a number field score), you could get the total score like that:

var usersCollectionRef = db.collection("users"); //Creates a reference to the Users collection

var query = usersCollectionRef.where("name", "==", "Steeve"); //Creates a query based on the collection

query.get().then(function(querySnapshot) { //Call get() to get a QuerySnapshot

    var score = 0;

    if (querySnapshot.empty) { //Check whether there are any documents in the result
        console.log('no documents found');
    } else {
        var data = querySnapshot.docs.map(function (documentSnapshot) {
            //Not necessary to do that  -> return documentSnapshot.data();
            console.log(documentSnapshot.data().name);
            score += documentSnapshot.data().score;
        });
    }

    console.log(score);

});

---

EDIT after edit of the original post

Do like that

var query = usersCollectionRef.orderBy("score", "desc").limit(10); //Creates a query based on the collection
query.get().then(function(querySnapshot) { //If query is needed
            if (querySnapshot.empty) { //Check whether there are any documents in the result
                console.log('no documents found');
            } else {
                var nameArray =  Array.from(querySnapshot.docs, x => x.data().name);
                console.log(nameArray);

                var scoreArray =  Array.from(querySnapshot.docs, x => x.data().score);
                console.log(scoreArray);
            }
});

Explanations:

• querySnapshot.docs returns "An array of all the documents in the QuerySnapshot." (See Ref: https://firebase.google.com/docs/reference/js/firebase.firestore.QuerySnapshot#docs)
• Then you use Array.from() to create the two arrays (see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)