0

I'm not sure why the following function returns a promise, when I'm using the async/await operators?

getBase64 = async (url) => {
  const response = await axios.get(url, {
  responseType: 'arraybuffer'
  })

  const buffer = new Buffer.from(response.data,'binary').toString('base64')
  return ('data:image/jpeg;base64,' + buffer)
}

I know I can simply add .then(data => console.log(data)) but I want to assign the raw data to a variable, like:

const base64Img = getBase64()

...which is not possible since the return type is a promise for some reason.

Armen Michaeli
  • 8,625
  • 8
  • 58
  • 95
Jat90
  • 493
  • 1
  • 10
  • 22
  • 6
    An async function **always** returns a promise. You can `await` the result as well – baao Sep 25 '19 at 17:41
  • @chrispbacon This is NOT a duplicate -- this question explicitly asks for an explanation, the way I interpret it. I expect the author to corroborate this. You have marked this a duplicate of another quesiton which is a potpourri of different `async`-related questions, none of which set the frame for an explanation I could have given had this question remained open. There is an overload of bad "how to filter an array" questions on SO that nobody closes, yet here we are with an arguably unique and valid question that gets closed within 3 minutes of being asked. – Armen Michaeli Sep 25 '19 at 17:49
  • I've reopened the question for you @amn - have fun. Just for the record, I totally disagree with you, the other answer gives explanation and, more important, the answer to 'why this particular `async` function returns a promise' is: 'Because that's what an `async` function does'. – baao Sep 25 '19 at 17:54
  • Thank you, let's see if my answer explains the "why". I think "that's what `async` function does" falls short of that. – Armen Michaeli Sep 25 '19 at 18:02
  • @amn Are you going to post an answer? If not - I'd have closed the question as well. – Bergi Sep 25 '19 at 18:37
  • No, it will take me some time to finish the answer, but I assure you none of the answers to the questions this question is marked duplicate of, provide the real explanation for the "why". [This](https://stackoverflow.com/a/35302826/254343) comes close, but is more of an excuse. I maintain this question must remain open, regardless of when I'll pen up my answer -- in fact it's not my answer that disproves duplicity. Feel free to mark *possible* duplicates, to create the useful connections. – Armen Michaeli Sep 25 '19 at 18:55

2 Answers2

2

An async function is just a promise. If you want the value returned, you will need to await it as well.

const bas64Img = await getBase64()

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

ChrisG
  • 2,637
  • 18
  • 20
0

Because it gives you a choice what to do. The code below async function invocation can be run immediately or it can wait till the async finishes.

You can even have some code that depends on async result to wait for a function to complete and some other code that doesn't care about the result run immediately:

someAsyncFunction().then(v => {
  // here goes the code that depends on v
}

// here goes the code that doesn't care about async completion

In blocking languages that behave just how you want it you can't do this. The rest of the code must always wait.

marzelin
  • 10,790
  • 2
  • 30
  • 49