Return value from callback function in Javascript

I am forced to use some Javascript code:

<!DOCTYPE html>
<html>
   <head>
      <!-- Must set compatibility to IE9 or greater -->
      <meta http-equiv="X-UA-Compatible" content="IE=9" >

      <!-- include the mongoose UserControl.js library -->
      <!-- NOTE: MAKE SURE TO MAKE THE src PATH RELATIVE TO THIS FILE  -->
      <script type="text/javascript" src="../$app/scripts/UserControl.js"></script>
      <script src="https://code.jquery.com/jquery-3.6.4.js"></script>
      <script type="text/javascript">
         TestFce = 
         {
            getProm: function(prom){
               let hodnota = WSForm.getCompValue(prom, function(value){
                  console.log("Value in callback: " + value);
               });
               return hodnota;
            }
         }
      </script>
   </head>
   <body style="font-family:Arial,Helvetica;font-size:12px">
      <button id="promTest" onclick="promTestClick()">Test value</button>
      <script>
        function promTestClick(){
         let val = TestFce.getProm("text1");
         console.log("Value: " + val);
        }
      </script>
</body>
</html>

And I need to return value from callback function in WSForm.getCompValue, to use it in promTestClick function. But according to console.log, it seems, that functions are called in different order then I need:
enter image description here

Please how can I correctly pass value into promTestClick function?