为什么javascript代码的输出不稳定

Question

我已经编写了以下代码。

var arrCityrecordForADay = [];
function getWeatherDataForCities(cityArray, callback) {
var toDaysTimestamp = Math.round((new Date()).getTime() / 1000) - (24 * 60 * 60);
for (var i in cityArray) {
for (var j = 1; j <= 2; j++) {
var jsonurl = "http://api.openweathermap.org/data/2.5/history/city?q=" + cityArray[i] + "&dt=" + toDaysTimestamp;
$.ajax({
url: jsonurl,
dataType: "jsonp",
mimeType: "textPlain",
crossDomain: true,
contentType: "application/json; charset=utf-8",
success: function (data) {
var arrCityRecordForDay = [];
arrCityRecordForDay.push({
"cityName": data.list[0].city.name
}, {
"weather": data.list[0].weather[0].description
});
var tempId = data.list[0].city.name+""+timeConverter(data.list[0].dt);
arrCityrecordForADay.push({
tempId: arrCityRecordForDay // Here tempId is inserted as "tempId" not its value
});
if (((arrCityrecordForADay.length)) === cityArray.length) {
callback(arrCityrecordForADay);
}
}
});
toDaysTimestamp = toDaysTimestamp - (24 * 60 * 60);
}
}
}
$(document).ready(function () {
var cityArray = new Array();
cityArray[0] = "pune";
cityArray[1] = "london";
var result = document.getElementById("msg");
getWeatherDataForCities(cityArray, function (jsonData) {
var myJsonString = JSON.stringify(jsonData);
console.log(myJsonString);
});
});
function timeConverter(UNIX_timestamp){
var a = new Date(UNIX_timestamp*1000);
var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
var year = a.getFullYear();
var month = months[a.getMonth()];
var date = a.getDate();
var hour = a.getHours();
var min = a.getMinutes();
var sec = a.getSeconds();
//var time = date+','+month+' '+year+' '+hour+':'+min+':'+sec ;
var time = date+''+month+''+year;
return time;
}

程序的输出不稳定。我的意思是在2-3次刷新后，有时显示正确的输出，有时显示错误的输出

正确的输出是

"[{"Pune25Dec2013":[{"cityName":"Pune"},{"weather":"Sky is Clear"}]},{"London22Dec2013":[{"cityName":"London"},{"weather":"overcast clouds"}]}]"

错误的输出是

"[{"Pune25Dec2013":[{"cityName":"Pune"},{"weather":"Sky is Clear"}]},{"Pune24Dec2013":[{"cityName":"Pune"},{"weather":"Sky is Clear"}]}]"

代码的工作流程出了什么问题。谢谢

Fiddle

我们将通知您的回复

Answer 1

解决问题的几件事：

1. 在成功回调中，如果您创建了一个哈希变量，它将允许您将tempId设置为对象的键。(现在，您的代码示例甚至与您显示的输出不匹配)。

   var arrCityRecordForDay = [];
   arrCityRecordForDay.push({
   "cityName": data.list[0].city.name
   }, {
   "weather": data.list[0].weather[0].description
   });
   var tempId = data.list[0].city.name+""+timeConverter(data.list[0].dt);
   // updated code
   var hash   = {};
   hash[tempId] = arrCityRecordForDay;
   arrCityrecordForADay.push(hash);
   

2. 当arrCityrecordForADay长度与cityArray相同时，会发生回调，但由于您正在为每个城市使用多个时间戳进行内部循环，因此检查应该不同。

   // update length check (the 2 here should be however much inner loop is)
   if (((arrCityrecordForADay.length)) === cityArray.length * 2) {
   callback(arrCityrecordForADay);
   }
   

3. 我确认"London"的JSON响应在页面刷新时会定期首先返回。您正在启动多个JSON请求，它们可以按任何顺序返回。因此，根据请求的速度，您的arrCityrecordForADay数组可以先有伦敦或浦那(以及任意一个城市的日期)。为了使其具有确定性，您可以按字母顺序进行排序。或者只存储为对象(hash)而不是数组。一旦你修复了上面的问题2，这个项目将更有意义。

要排序，一种方法是使用数组数组，而不是哈希数组。。(更简单的模型，因为每个散列无论如何都只有一个元素)，然后定义一个排序方法。

var tempId = data.list[0].city.name+""+timeConverter(data.list[0].dt);
// array instead of hash
arrCityrecordForADay.push([tempId, arrCityRecordForDay]);
if (((arrCityrecordForADay.length)) === cityArray.length * 2) {
callback(arrCityrecordForADay.sort(compareCities));
}
...
// define this on page somewhere - looks at first element in array (the "tempId" value from above)
function compareCities(a,b) {
if (a[0] < b[0])
return -1;
if (a[0] > b[0])
return 1;
return 0;
}