將JSON數據合併到一個jQuery變量

Question

所以我能夠獲得兩個單獨的JSON請求並分別單獨提取數據。我無法弄清楚如何將數據從一個JSON數組合併到另一個數組。下面是調用兩個JSON數組的JS，這個想法是能夠匹配兩個數組中的日期，並在日曆上每天分出目標數據（轉換，完成，值）。所有的數據都應該添加到citationHTML變量中。

 var zipcode = '27560'; 
    var appid = '96afa96cadeb7165258ae95b77fdc'; 
    var startdate = '2015-09-01'; 
    var enddate = '2015-09-30'; 
    var timeperiod ='24';   

    var dataUrl = '//api.worldweatheronline.com/premium/v1/past-weather.ashx?q='+ zipcode +'&format=json&date='+ startdate +'&enddate='+ enddate +'&tp='+ timeperiod +'&key='+ appid  

    var dataUrl2 = '//westbrookfl.com/wp-content/plugins/CSAnalytics/lib/data/data-GoalValueTotals.php' 

    //Creates Table for Citation Data  
     $.when(
      $.getJSON(dataUrl), 
      $.getJSON(dataUrl2) 
     ).done (function (data, data2) { 
      var data = data[0].data; 
      console.log(data, data2); 
      var citationHTML = ''; 
      var channelHTML = ''; 
      jQuery.each(data, function (i) { 
      var weather = data.weather; 
       for (var i = 0; i < weather.length; ++i) { 
        citationHTML += '<li id="day'+[i]+'" class="day"><div class="date">' + weather[i].date + '</div><div class="svg-icon"><img src="' + weather[i].hourly[0].weatherIconUrl[0].value + '" /></div><div class="data-wrap col2"><p class="data hi-temp"><span>' + weather[i].maxtempF + '</span><sup class="deg ng-scope" data-ng-if="hasValue()">°</sup></p><p class="data lo-temp"><span>' + weather[i].mintempF + '</span><sup class="deg ng-scope" data-ng-if="hasValue()">°</sup></p></div><p class="data desc">' + weather[i].hourly[0].weatherDesc[0].value + '</p></li>'; 
       } 
      }) 
      jQuery.each(data2[0], function (i, item) {     
       channelHTML += '<tr><td class="tg-yw4l">' + item.date + '</td><td class="tg-yw4l">' + (+item.goalConversionRateAll).toFixed(2) + '%</td><td class="tg-yw4l">' + item.goalCompletionsAll + '</td><td class="tg-yw4l">$' + item.goalvalueall + '</td></tr>'; 
      }) 
      jQuery('#citation_report').append(citationHTML); 
      jQuery('#channeldata_table').append(channelHTML); 
     }); 

這裏是它小提琴，以及：https://jsfiddle.net/joseph_a_garcia/s41kr5hj/52/

Answer 1

循環時你的第一陣列，你需要存儲，可以在你的第二個循環使用的查找值。

在第一循環創建一個查詢對象，則：

var key = weather[i].date.replace(/-/g,'') 
lookup[key] = i; 

然後使用該對象在第二循環中找到匹配的項目。這是你的代碼重新編寫：

$.when(
    $.getJSON(dataUrl), 
    $.getJSON(dataUrl2) 
).done (function (data, data2) { 
    var data = data[0].data; 
    console.log(data, data2); 
    var citationHTML = ''; 
    var channelHTML = ''; 
    var lookup = {}; 
    var weather = data.weather; 
    for (var i = 0; i < weather.length; ++i) { 
     var key = weather[i].date.replace(/-/g,''); 
     lookup[key] = i; 
     citationHTML += '<li id="day'+[i]+'" class="day"><div class="date">' + weather[i].date + '</div><div class="svg-icon"><img src="' + weather[i].hourly[0].weatherIconUrl[0].value + '" /></div><div class="data-wrap col2"><p class="data hi-temp"><span>' + weather[i].maxtempF + '</span><sup class="deg ng-scope" data-ng-if="hasValue()">°</sup></p><p class="data lo-temp"><span>' + weather[i].mintempF + '</span><sup class="deg ng-scope" data-ng-if="hasValue()">°</sup></p></div><p class="data desc">' + weather[i].hourly[0].weatherDesc[0].value + '</p></li>'; 
    } 
    jQuery('#citation_report').append(citationHTML); 
    jQuery.each(data2[0], function (i, item) { 
     var day = $("#day" + lookup[item.date]); 
     day.append('<tr><td class="tg-yw4l">' + item.date + '</td><td class="tg-yw4l">' + (+item.goalConversionRateAll).toFixed(2) + '%</td><td class="tg-yw4l">' + item.goalCompletionsAll + '</td><td class="tg-yw4l">$' + item.goalvalueall + '</td></tr>'); 
    }) 
}); 

這裏有一個固定的小提琴：https://jsfiddle.net/s41kr5hj/54/