How do I store a value from a petition?

Question

I want to get a value from an API and save that value for later, but I'm having troubles.

I get the result I want when I use console.log(), but when I do exactly the same thing with "return()" I get this result:

Promise{< resolved >:"The value I want"}

I'll show you my code:

const getDataAA = async () => {
  const response = await fetch("https://s3.amazonaws.com/dolartoday/data.json")
  const data = await response.json()
  console.log("async/await based")
  console.log(data.USD.transferencia)
}

When I call getDataAA() I get what I want in the console, but I want to store that value in order to use it, so I changed "console.log(data.USD.transferencia)" for "return(data.USD.transferencia)".

Then I do something like this in order to save the value:

let dolarPrice = getDataAA()

Why when I use "console.log" I get the value but when I use "return" I get also the promise?

Thanks for your answer. Is there a way to return only the value? — nardoyala, Sep 27 '19 at 14:56
@BernardoAyala No. You are making an asynchronous IO operation, so you cannot have it return only the value. However, if you prefix your function call by `await`, your variable will have the value : `let dolarPrice = await getDataAA()` — Seblor, Sep 27 '19 at 14:57
Ok, I get it, now I understand what's happening, thank you for that. I tried to use "await" with the function as you told me and I get this error: Uncaught SyntaxError: await is only valid in async function But I don't know why, the function is asyncrhonous. — nardoyala, Sep 27 '19 at 15:02
@BernardoAyala I copy/pasted your code from your question, with the `await` call (like in my comment), and I got `async/await based` followed by `21402.71`. Make sure your actual code is the same as from your question. — Seblor, Sep 27 '19 at 15:14
Oh yes, I get that result in the console, too. But I'm having troubles saving that value. Did you write the let dolarPrice = await getDataAA() inside or outside the function?. Because when I write it inside I can't use that value again, the console says that "dolarPrice" is not define — nardoyala, Sep 27 '19 at 15:19
I don't understand. Of course I called it outside the function, otherwise it would be recursive. — Seblor, Sep 27 '19 at 15:21
@Seblor Sorry for being so confusing but I'm new in JavaScript and everything is confusing to me xD. I asked because I'm getting this error when I call it outside the function: Uncaught SyntaxError: await is only valid in async function I'm trying to understand why, but I don't get it, yet. — nardoyala, Sep 27 '19 at 15:27
Ah, this is because the `await` keyword is not available at the top-level. the keywork can only be used in an `async` function. More information on that here : https://stackoverflow.com/questions/46515764/how-can-i-use-async-await-at-the-top-level. But good news ! the top-level await feature is a stage 3 proposal (https://github.com/tc39/proposal-top-level-await) ! — Seblor, Sep 27 '19 at 15:33

Riccardo Gai · Answer 1 · 2019-09-27T15:34:03.180

0

        const getDataAA = async () => {
          const response = await fetch("https://s3.amazonaws.com/dolartoday/data.json")
          return response.json()
        }

        let response = await getDataAA();
        console.log(response);

-- EDITED

so this one another example how use it.

the async method (getDataAA) have to return something.
everytime you need to call an async method you have to use await ( if you wait until it's completed)
everytime you use await the method must be async.

<!DOCTYPE html>
<html>
    <script type="text/javascript">

  var f = async () => {
   const getDataAA = async () => {
     const response = await fetch("https://s3.amazonaws.com/dolartoday/data.json")
     return response.json()
   }

   let response = await getDataAA();
   console.log(response);
  }
  f();
    </script>
</html>

edited Sep 27 '19 at 15:34

answered Sep 27 '19 at 15:21

Riccardo Gai

421
1
6
19

Can you explain what you did and how you solved OP's issue ? A good explanation can do much more than a code snippet. – Seblor Sep 27 '19 at 15:22
Thanks for your answer. I think that maybe something is wrong with my browser because I copy/pasted this exactly as you wrote it and I get this error : Uncaught SyntaxError: await is only valid in async function. – nardoyala Sep 27 '19 at 15:24
The async function ( getDataAA) needs to returns a value obviously, then everytime you need to call an async function ( and you want to wait it) you have to use await. – Riccardo Gai Sep 27 '19 at 15:28
@RiccardoGai Thanks Ricardo, I copied your code, but I still don't understand how to store the value I want to use for other operations. With your code I get the response in the console, but I want to store a value inside a variable to use it later. – nardoyala Sep 27 '19 at 15:40
let response = await getDataAA(); with this the response is stored in a variable and you can use for any operations you want – Riccardo Gai Sep 27 '19 at 15:46
@RiccardoGai But when I call that variable in the console it says that is not defined, I'm not able to use that value outside the function. – nardoyala Sep 27 '19 at 15:56

score 0 · Accepted Answer · answered Sep 27 '19 at 15:53

I discovered I way to solve this! I defined a variable outside the function and then the function stored the value I wanted inside that variable. This is my code:

const getDataAA = async () => {
  const response = await fetch("https://s3.amazonaws.com/dolartoday/data.json")
  const data = await response.json()
  console.log("async/await based")
  dolarPrice = (data.USD.transferencia)
}

let dolarPrice

getDataAA()

That way I stored the value inside the "dolarPrice" variable. Thanks all the people who answered my question, I found the solution thanks to all of you.

How do I store a value from a petition?

2 Answers2