Wie erhalte ich das Ergebnis einer asynchronen Anfrage und gebe es aus einer Funktion zurück?

Hallo zusammen! Ich bin neu in JavaScript und habe ein Problem, das ich einfach nicht lösen kann. Ich schreibe einfachen Code, der eine AJAX-Anfrage an eine API stellt und versucht, die erhaltenen Daten zurückzugeben, aber ich bekomme immer undefined. Hier ist mein Code:

function getUserData(userId) {
    let userData;
    
    $.ajax({
        url: 'https://api.example.com/users/' + userId,
        method: 'GET',
        success: function(response) {
            userData = response;
            console.log('Innerhalb von success:', userData); // Daten sind da!
        }
    });
    
    return userData; // Immer undefined
}

const result = getUserData(42);
console.log('Außerhalb:', result); // undefined

Ich verstehe, dass das Problem in der Asynchronität liegt – die Funktion getUserData gibt den Wert zurück, bevor die Antwort vom Server kommt. Aber wie bekomme ich dann die Daten richtig und verwende sie weiter im Code? Ich habe verschiedene Ansätze ausprobiert: globale Variablen, setTimeout, aber nichts