如何訪問JavaScript數組中的項目？

Question

我有一個AJAX GET返回一個數組，如下所示：

{ 
「periodStart」 : 「2016-10-09T06:00:00Z", 
「periodEnd":"2016-10-16T06:00:00Z", 
「nextPageStart":null, 
「prevPageStart":"2016-10-02T00:00:00Z", 
「period":"WEEKLY", 
「powerInfo":null, 
「totalSavings": 
5.8863351343078, 

「savings」:[ 
{ 
「maxTemperature":75, 
「acRunSeconds":16432, 
「savedRunSeconds":3266, 
「kwhSaved":60.342324672236224, 
」periodStart":"2016-10-09T06:00:00Z", 
「savedMoney":1.5085581168059057, 
「normalMoneyCost」:1.6226692279170167, 
「periodName":"Sunday" 
}, 
{ 
「maxTemperature":74, 
「acRunSeconds":6822 
,」savedRunSeconds":5657, 
「kwhSaved":76.18189032209128, 
「periodStart":"2016-10-10T06:00:00Z", 
「savedMoney":1.904547258052282, 
「normalMoneyCost":1.951922258052282, 
「periodName":"Monday" 
}, 
{ 
「maxTemperature":62, 
「acRunSeconds":9311, 
「savedRunSeconds":12, 
「kwhSaved":28.03764418071857 
,」periodStart」:"2016-10-11T06:00:00Z", 
「savedMoney":0.7009411045179643, 
「normalMoneyCost":0.7656008267401866, 
「periodName":"Tuesday" 
}, 
{ 
「maxTemperature":78, 
「acRunSeconds":11275, 
「savedRunSeconds":1431, 
「kwhSaved":34.191927009102564, 
「periodStart":"2016-10-12T06:00:00Z", 
「savedMoney":0.8547981752275642, 
「normalMoneyCost":0.9330967863386753, 
「periodName":"Wednesday" 
}, 
{ 
「maxTemperature":78, 
「acRunSeconds":17967, 
「savedRunSeconds":11864, 
「kwhSaved":26.880751977008043, 
「periodStart":"2016-10-13T06:00:00Z", 
「savedMoney":0.6720187994252012 
,」normalMoneyCost":0.7967896327585345, 
「periodName":"Thursday" 
}, 
{ 
「maxTemperature":78, 
「acRunSeconds":7649, 
「savedRunSeconds」:2008, 
「kwhSaved":4.5674527454968805, 
「periodStart":"2016-10-14T06:00:00Z", 
「savedMoney":0.11418631863742201, 
「normalMoneyCost":0.16730437419297756, 
「periodName」:"Friday" 
}, 
{ 
"maxTemperature":73, 
「acRunSeconds":6174, 
「savedRunSeconds":1876, 
「kwhSaved":5.251414465658444, 
「periodStart":"2016-10-15T06:00:00Z", 
「savedMoney":0.1312853616414611, 
「normalMoneyCost」0.1741603616414611, 
「periodName":"Saturday" 
} 
], 
「temperatureUnit":"F", 
「currency": 
{ 
「name":"USD", 
「symbol":"$" 
} 
} 

如何抓住從陣列單個值？ 舉例來說，如果我想返回值「1.5085581168059057" 爲‘savedMoney’陣列中的標題和將其設置爲以下變量：

var savings_graph1 = 1.5085581168059057

我將如何做到這一點我想我會必須遍歷數組並找到它，但每次嘗試時，我都會得到「undefined」或[object Object]錯誤。

最終目標是將該數字放入圖形並繪製節省;我無法似乎從數組中得到正確的數字到一個變量，所以我可以在我的JavaScript中使用它。

數組中的數字將被放置到以下D3.js中的.data（）字段中，該字段將在圖表上繪製數字。

vizs[0] 
    .data(280)        // current value 
    .min(0)         // min value 
    .max(100)        // max value 
    .capRadius(1)       // Sets the curvature of the ends of the arc. 
    .startAngle(250)      // Angle where progress bar starts 
    .endAngle(110)       // Angle where the progress bar stops 
    .arcThickness(.12)      // The thickness of the arc (ratio of radius) 
    .label(function (d,i) {     // The 'label' property allows us to use a dynamic function for labeling. 
     return d3.format("$,.2f")(d); 
    }); 

vizs[1] 
    .data(550)        // current value 
    .min(0)         // min value 
    .max(200)        // max value 
    .capRadius(1)       // Sets the curvature of the ends of the arc. 
    .startAngle(210) 
    .endAngle(150) 
    .arcThickness(.07) 
    .label(function (d,i) { return d3.format(".0f")(d); }); 

vizs[2] 
    .data(820)        // current value 
    .min(0)         // min value 
    .max(300)        // max value 
    .capRadius(1)       // Sets the curvature of the ends of the arc. 
    .startAngle(180) 
    .endAngle(180) 
    .arcThickness(.04) 
    .label(function (d,i) { return d3.format(".0f")(d) + "%"; }); 

最終的結果將是如下：完成AJAX GET請求，數據從陣列取出並送至一個變量，變量是在D3的代碼中使用的數據，然後被在圖上繪製結束用戶。如果有人知道如何從數組中獲取數據到Javascript變量，我會非常感激。

Ajax請求如下所示：

function getSavings() { 

    var baseUrl = $('#stage_select').find(":selected").val(); 

    $('#date-output').html("UTC date now: " + moment.utc().format()); 

    var url = baseUrl + "/savings/acunits/{acid}/random"; 

    var username = document.getElementById('email').value; 
    var password = document.getElementById('password').value; 
    var data = {"email" : username , "password" : password}; 
    $('#output').append("request " + url + "\n"); 
    $.ajax({ 
     type: "GET", 
     url: url, 
     dataType: 'json', 
     contentType: 'application/json', 
     data: JSON.stringify(data), 
     processData: false, 
     async: true, 
     beforeSend: function (xhr) { 
     xhr.setRequestHeader ('Authorization', 'Basic ' + btoa(username + ':' + password)); 
     }, 
     success: function (res) { 
      $('#output').append("response -> " + JSON.stringify(res) + "\n\n"); 
     }, 
     error: function (jqxhr) { 
      $('#output').append("response " + JSON.stringify(jqxhr.responseText) + "\n\n"); 
     }, 
    }); 
} 

Answer 1

想通了！

如下需要EVAL數組：

var all = eval("(function(){return " + array + ";})()"); 

一旦做alert(all.savings[0].savedMoney);工作。

謝謝哈科，你的答案是最接近的。

完整的AJAX調用看起來像這樣：

$.ajax({ 
    type: "GET", 
    url: url, 
    dataType: 'json', 
    contentType: 'application/json', 
    data: JSON.stringify(data), 
    processData: false, 
    async: true, 
    beforeSend: function (xhr) { 
    xhr.setRequestHeader ('Authorization', 'Basic ' + btoa(username + ':' + password)); 
    }, 
    success: function (res) { 
    $('#output').append(JSON.stringify(res)); 
    var firstDivContent = document.getElementById('output'); 
    var array = firstDivContent.innerHTML; 
    var all = eval("(function(){return " + array + ";})()"); 
    alert(all.savings[0].savedMoney); 

    }, 
    error: function (jqxhr) { 
     $('#output').append("response " + JSON.stringify(jqxhr.responseText) + "\n\n"); 
    }, 
});