0

sample()のjsoninfoにデータを入れたいのですが、loadJson()の箇所でjsonに値が入る前にreturnされてしまうので、jsonInfoに値が入っていない状況です。

処理が終わってからreturnされるのが理想なんですが、どう記述すればいいか教えて頂きたいです。

非同期処理についてasync/awaitの使い方が分かっておらず、、、

   function sample() {
     var jsonInfo = loadJson();
   }

   function info(obj) {
     var id = obj.sample1.value.id.value;
     var user = obj.sample1.value.user.value;
     return {
       "id": id,
       "user": user
     }
   }

   function loadJson() {
     var json;
     $.getJSON("data.json", function(data) {
       var obj = data[0];
       json = info(obj);
       console.log(json); //値が入っている、2番目に表示される
     });
     console.log(json); //undefined、1番目に表示される
     return json;
   }
2

1 件の回答 1

1

$.getJSONはPromiseを返しますので、async/awaitを使って下記のような変更はいかがでしょうか。

修正したスクリプト:

// これを実行
async function sample() {
  var jsonInfo = await loadJson();
  console.log(jsonInfo)
}

function info(obj) {
  var id = obj.sample1.value.id.value;
  var user = obj.sample1.value.user.value;
  return {
    "id": id,
    "user": user
  }
}

async function loadJson() {
  var data = await $.getJSON("data.json");
  var obj = data[0];
  json = info(obj);
  return json;
}
  • 上記のスクリプトでsample()を実行すると、console.log(jsonInfo)で取得した値がコンソールに表示されると思われます。

参考:

この質問に回答するには、ログインする必要があります。