javascript console log shows "> Object" on first load while objects's data on page refresh

Question

I have 2 ajax calls running on separate functions but in the same pattern with use of promise, in which when I console.log the response I get "Object" in console window, which can be seen containing the data if we expand it(see the expanded object screenshot below). But when we consume it, I get the undefined error for a particular object value(though I can still see it in "Object" expanded tree in console).

Now if I refresh the page I can see the actual/expected console results as the details of objects right there on console window. Attached is the screen shot of how 2 console window differs

Below is the complete code:

function setMessages() {
    return new Promise((resolve, reject) => {
        var url = env.NEW_SERVER_URL + '/api/client/getScripts/carrier/';
        $.ajax({
            type: 'GET',
            contentType: "application/json",
            url: url,
            success: function (response) {
                //   logInConsole(response);
                var msgData = JSON.stringify(response);
                resolve(msgData);
            },
            error: function (error) {
                logInConsole("some error in connection with server for getting messages");
            }
        });
    })
}


function setAppConfig() {
    return new Promise((resolve, reject) => {
        var url = env.NEW_SERVER_URL + '/api/client/getConfig/carrier/';
        $.ajax({
            type: 'GET',
            contentType: "application/json",
            url: url,
            success: function (response) {
                var configData = JSON.stringify(response);
                resolve(configData);
            },
            error: function (error) {
                console.log("some error in connection with server for getting config data");
            }
        });
    })
}

function getMessages() {
    var msgs = "";
    var appMessages = "";
    setMessages().then(res => {
        console.log("Msgs Resolved");
        msgs = res;
        sessionStorage.setItem('messages', msgs);
        if (fetchFromSession('messages') !== null) {
            appMessages = JSON.parse(fetchFromSession('messages'));
            console.log(appMessages);
        } else {
            console.log('Something went wrong in pulling the configs');
        }
    });
    return appMessages;
}

function getConfig() {
    var config = "";
    var appConfig = "";
    // console.log(fetchFromSession('config'));
    setAppConfig().then(res => {
        console.log(" Config Resolved");
        config = res;
        sessionStorage.setItem('config', config);
        if (fetchFromSession('config') !== null) {
            appConfig = JSON.parse(fetchFromSession('config')); 
            console.log(appConfig);
        } else {
            console.log('Something went wrong in pulling the configs');
        }
    });
    return appConfig;
}
var appConfig = getConfig();
var appMsgs = getMessages();

Please help me to understand why do I get 2 different sets of console output but only later one(on page refresh) working for me