how to return value to caller function in asynchronous javascript and web3js

Question

in the below example I can see hash written to the console from someFunction, however I am unable to get the r returned to the callerFunction. There output is undefined. How do I get the h value returned to callerFunction

async function caller(){
  var val = 10;
  let result = await someFunction(val);
  console.log(result);
}

async function someFunction(val) {
   let r = await contract.methods.updateValue(val).send({from: account})
   .on('transactionHash', function(h){
      console.log(h);
      return h;
   })

   return r; 
}

I have tried few variations below:

Variation 1

async function someFunction(val) {
   return contract.methods.updateValue(val).send({from: account})
   .on('transactionHash', function(h){
      console.log(h);
      return h;
   })

   return r; 
}

Variation 2

async function someFunction(val) {
   return r = contract.methods.updateValue(val).send({from: account})
   .on('transactionHash', function(h){
      console.log(h);
      return h;
   })
}

Variation 3

async function someFunction(val) {

   var result;
   let r = await contract.methods.updateValue(val).send({from: account})
   .on('transactionHash', function(h){
      console.log(h);
      result = h;
   })
   return result;
}

and still can't get it working....

Answer 1

the most convenient way would be to use callbacks as follow:

async function caller(){
  var val = 10;
  await responder(val, async function(e, res){
    if(res.status === 'success' && res.hash) {
      //do stuff with res.hash
    } else {
      //handle error here 
    }
  })
}

async function responder(val, callback) {
   contract.methods.updateValue(val).send({from: account})
   .on('transactionHash', (hash) => {
      callback(null, {'status': 'success', 'hash': hash});
   })
   .on('error', (e)=> {
        callback(null, {'status': 'error', 'error': e.message})
    })
}