Get base64 from image upload with file reader onloaded

Question

I have this JS code. It reads the file upload and the goal is, if there was an upload, to rewrite the variable src with the base64 for the image.

var file = document.getElementById('fileUpload').files[0];

var src = 'NOIMAGE';

if (file)
{
    var reader = new FileReader();

    reader.onloadend = function () 
    {
        src = reader.result;
        console.log(src);
        
    };
    reader.readAsDataURL(file);
}

console.log(src);

When it runs with a valid image upload, the first log prints the correct base64 string, but the second one still returns NOIMAGE. I think this is just a matter of changing a variable from within the onloadend. Thanks so much!