JSOM Get list count

Question

I have this code (in App.js file):

var verificheList;
var ctx = SP.ClientContext.get_current();

var hostWebURL = decodeURIComponent(getQueryStringParameter("SPHostUrl"));
var verbaleList;
var noop = function () { };
var statoVerifica;
var listTitle = 'Verbale Collaudo Fase 1 - Fine Montaggio';

function getVerificheCount(title, stato) {

    statoVerifica = stato;
    listTitle = title;
    var hostWebContext = new SP.AppContextSite(ctx, hostWebURL);
    verbaleList = hostWebContext.get_web().get_lists().getByTitle(listTitle);
    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml(
        '<View><Query><Where><Eq>' +
        '<FieldRef Name=\'Verifica\'/><Value Type=\'Choice\'>' + stato + '</Value>' +
        '</Eq></Where></Query></View>');
    verificheList = verbaleList.getItems(camlQuery);
    ctx.load(verificheList);
    ctx.executeQueryAsync(noop, onGetverificheListFail);
    return verificheList.get_count();
}

But I got this error:

sp.runtime.js:2 
Uncaught Error: La raccolta non è stata inizializzata. Non è stata richiesta oppure la richiesta non è stata eseguita. Potrebbe essere necessario richiederla in modo esplicito.  
    at Function.Error.create (ScriptResource.axd?d=BVrFVl13Eo6pwgbtdwz-bzf_bf5-Fql_73RwlhGNsBAGel-cKU7OkT4jubFy4rQGKpXHed4O4zolQ_5WheE0IR6AYk3Hq_cORL76YvzjvoJyuAYJNuCcQXWu64kyr6vZRhzogddV95zmN5cAYkcc_0S0qDqgHiwdYVbjCXUVzbEmYwwFdBPhLwKtIUwMR5n60&t=ffffffffad4b7194:5)  
    at SP.ListItemCollection.$33_1 (sp.runtime.js:2)  
    at SP.ListItemCollection.get_count (sp.runtime.js:2)  
    at getVerificheCount (<anonymous>:27:26)  
    at <anonymous>:1:64 

It seem like I can't access the

get_count()

property, when I use this code.

Strangely enought, instead, if I try with the Chrome:console

verificheList.get_count()
< 2 RESULT

it shows the correct result (2).

UPDATE

I have tried to understand the promise function but the arguments it's a little too difficult for me.

In the Default.aspx page I use this (ugly I know) code to update a label based on the items on a Sharepoint collection:

<p><asp:Label id="Verbale1VerificheNON_OK" runat="server" Text="0" ForeColor="Red"></asp:Label> </p>
        <script type="text/javascript">
            document.getElementById('Verbale1VerificheNON_OK').innerHTML = getVerificheCount('Verbale Collaudo Fase 1 - Fine Montaggio','Verifica NON OK');
        </script>

I have read jquery promise but I have only grasped the surface of issue. On jquery page the examples are related to animations applied to divs...
Instead the link you posted on SharePoint StackExchange it's quite difficult to understand the matter.

How (and where) should I apply the promise function to my code?

Answer 1

Instead of using noop in your executeQueryAsync you should pass a function, which will be called as soon as your async request is ready. Below code prints your count correctly:

verificheList = verbaleList.getItems(camlQuery);
ctx.load(verificheList);
ctx.executeQueryAsync(function(){
    console.log(verificheList.get_count());
}, onGetverificheListFail);  

For your convenience I also suggest to use promises with your code. For example jquery based as described in the answer here