I am not used to asynchronous method so I would like to have your help. I have this ajax method that gets the data of my mysql tables. I need to retrieve this data to use it in my code.

Here is my code :

function ajaxRequest(type,url,callback,data=""){
    let request = new XMLHttpRequest();
    request.open(type, url);

    request.onload = function () {
        switch (request.status){
            case 200:
            case 201: //console.log(request.responseText);
                    callback(request.responseText);
            break;
            default: console.log(request.status);
        }
    };
    request.send(data);
}

function setAvailableQuestions(){
    ajaxRequest("GET","../controller.php?func=get_availableQuestion", (questions) => {
        var allQuestions = JSON.parse(questions);
        return allQuestions;
    });
}

function getNewQuestion(){
    var availableQuestions = setAvailableQuestions();
    console.log(availableQuestions); //undefined

}

I read that you could solve it in two different ways, first one is to put ajax request asynchronous to false :

function setAvailableQuestions(){
    var ajax = new XMLHttpRequest();
    var asynchronous = false;
    ajax.open("GET","../controller.php?func=get_availableQuestion", asynchronous);
    ajax.send();
    ajax.onreadystatechange = function(){
        var allQuestions = JSON.parse(this.response);
        return allQuestions;
    }
}
    
 function getNewQuestion(){
        var availableQuestions = setAvailableQuestions();
        console.log(availableQuestions); //undefined
}

But it still displays undefined And the other method is to use .then or await for asynchronous methods but I don't know how to apply it to my first code.

Does anyone has an idea to help me ?