Aura Attribute becomes undefined after being set

Question

having an issue where after a server call and confirmed setting of the

getContentId : function(cmp, event) {

    var action = cmp.get("c.getConVerId");

    console.log(cmp.get("v.fileId"))

    action.setParams({ 
       "fId": cmp.get("v.fileId")
        });

   action.setCallback(this, function(response){
       var state = response.getState();
       if (state === "SUCCESS") {

           var returner = response.getReturnValue();
           console.log(returner);

           cmp.set('v.ContVerId',returner.Id)


           console.log(cmp.get('v.ContVerId'));


    }
});
   $A.enqueueAction(action);
   console.log(cmp.get('v.ContVerId'));
}

The first console.log(cmp.get('v.ContVerId')); shows the aura attribute as having been set to the intended content version Id. However the second console.log(cmp.get('v.ContVerId')); returns as undefined. I do not understand what is going on. Var returner is an object with a Id key value which i access and set to the aura attribute ContVerId which is a String attribute. Feel like i'm doing this all correctly but it is undefined even though initially it has been defined in the Callback

here is my apex class

@AuraEnabled
 public static ContentVersion getConVerId (string fId) {
    ContentVersion contverId = [SELECT Id FROM ContentVersion WHERE 
ContentDocumentId = :fId];       
    return contverId;
}

fId is a Content Document Id that i pass in

Answer 1

As mentioned in the documentation Calling a Server-Side Action

a callback is called after the server-side action is completed and $A.enqueueAction(action) adds the server-side controller action to the queue of actions to be executed.

This means that the value hasnt been set in your attribute as of yet, so, when your "second" console log is geing executed, the value is still undefined.

In a nutshell, the console log that you set after queueing the action is being called before.