ajax - 来自 GIPHY API 上的异步回调的未定义响应

Question

// //create the src for gif
function loadGiphyData(tag, callback){
  var data;
  var request = new XMLHttpRequest();
  request.open('GET', `https://api.giphy.com/v1/gifs/search?q=${tag}&api_key=5p8A1b1szDSqAVgDP1m2dlq8z0rdO3h1&limit=10`, true);
  request.onload = function() {
    data = JSON.parse(request.responseText).data[Math.floor(Math.random()*11)].images.original.url;
    console.log(data);
    return callback(data);
  }
  request.send();
}

大家好，我在让回调函数返回值时遇到问题。我正在使用 GIPHY API 返回 GIF 的 URL，但是当我 console.log() 时，返回值总是未定义。

console.log(loadGiphyData("dog", function(result) {return result;}));

我已经阅读了 Felix Kling 对异步工作原理的回答，并尝试实现他对回调函数的使用，但我仍然没有得到任何回报。-> 如何从异步调用返回响应？

任何帮助将不胜感激，谢谢！