javascript - 访问 $.ajax 语句内分配的 JSON 时出现问题

Question

我正在尝试使用 forecast.io API(最终)制作一些东西，每天都会通过电子邮件向我发送有关我所在地区天气的信息。当我向 API 发出请求时，它会向我提供一个包含所有信息的 JSON 对象。我用 JavaScript 和 PHP 写这个。这是我到目前为止的代码(现在有点困惑):

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">

var latitude = "42";
var longitude = "-71";
var coordinates = latitude + "," + longitude;

var forecast;

$.ajax({
  url: "<?php echo $_SESSION['url'] ?>42,-71",
  type: "GET",
  dataType: "jsonp",
  crossDomain: true,
  jasonpCallback: 'blah',
  success: function(data) {
    forecast = data;
    console.log(forecast.daily.summary);
  },
  error: function() {
    console.log("This failed.");
  }
});

//**********************************

document.write(getDailySummary());


//**********************************
function getDailySummary() {
  var summary = forecast.daily.summary;
  return "<p>" + summary + "</p>";
}

</script>

现在，$.ajax() 语句成功运行，并且预测摘要已记录在控制台中。然而，getDailySummary()运行得不太好。当我运行此命令时，出现以下错误:

Uncaught TypeError: Cannot read property 'daily' of undefined           index.php:42
  getDailySummary                                                       index.php:42
  (anonymous function)                                                  index.php:37
Rain on Thursday and Friday; temperatures rising to 85° on Saturday.    index.php:28

这听起来像 forecast未定义。我最初的想法是它与范围有关，但我尝试过摆弄各种事情，包括将预测定义为 window.forecast ，但我总是收到此错误。我哪里出错了？

Answer 1

Ajax 是异步的。

ajax 方法下面的行在填充数据之前执行。在成功处理程序内调用该函数

因此，当您尝试访问预测对象时，它仍然是未定义的。

success: function(data) {
    forecast = data;
    console.log(forecast.daily.summary);

    getDailySummary(forcast);
  },

切勿使用 document.write 写入 HTML。尝试将数据附加到页面上的某个元素。