http.getの結果を格納した配列の内容がundefinedになる


APIを叩いて取得した値を配列に入れて、任意のタイミングで取り出したいです。

[code]

    const http = axios.create({
        baseURL: 'base-url',
    })
    
    var a = []
    
    function addArray () {
      http.get('/hoge/fuga', { data: {} }).then(response => {
        a.push(response.data.name)
      })
    }
    
    Array.from({ length: 30 }).map(() => {
        addArray()
        console.log(a[0])
      })
    
[/code]

一部ソースコードを省略していますが、`console.log(a[0])`とすると`undefined`となってしまします。

`console.log(a)`だけで出力すると下記のようになり、index:0で取得できそうなのですが、取得できません。

[code]

    []
        0: '名前'
        length: 0
        __proto: Array(0)
            concat: f concat()
            長いので省略します
    
[/code]

取得できない原因は何でしょうか。




取得できないのではないと思います。

`console.log(a[0])` を実行したタイミングでは

[code]

    .then(response => {
        a.push(response.data.name)
    })
    
[/code]

のコールバックが呼ばれておらず、まだ値が設定されていないだけではないでしょうか？

