將JavaScript對象轉換爲JSON字符串以獲得密鑰和值

我正在爲客戶端構建Web應用程序，我非常接近完成任務，但有一些懸念需要一點幫助。將JavaScript對象轉換爲JSON字符串以獲得密鑰和值

我需要幫助將JavaScript對象的KEY和VALUE轉換爲JSON字符串，以便我可以在Chart中使用它。我使用的圖表是ChartJS。

這是我的數組看起來像。

Object {full-time: Object, part-time: Object} 
    full-time: Object 
     Access: 1 
     Excel: 2 
     Facebook: 1 
     NoSQL: 1 
     PHP: 1 
     WebEX: 1 
     WordPress: 1 
    part-time: Object 
     .NET: 1 
     Adobe Photoshop: 1 
     Visual Basic: 1 
     WordPress: 1 
     XML: 1

我的最終目標是有這樣幾個變量，所以當我通過主對象上的$。每次跑我有它在這樣的代碼：

skillGraph[key]['labels'] = SOMETHING HERE (.push ??)

然後當我們控制檯登錄每個變量的他們會是這樣的：

skillGraph['part-time']['labels'] = [".NET","Adobe PhotoShop", "Visual Basic","WordPress", "XML"] 
skillGraph['part-time']['values'] = [1,1,1,1,1]

這樣我可以呼叫的ChartJS圖所示：

var workerTypePT = { 
    labels : skillGraph['part-time']['labels'], 
    datasets : [    
     { 
      fillColor : "rgba(151,187,205,0.5)",     
      highlightFill : "rgba(151,187,205,0.75)", 
      data: skillGraph['part-time']['values'] 
     } 
    ] 
}

我試過了什麼？

我已經試過在主對象上做一個$ .each，然後做一個$ .each這個關鍵字就是我當前的代碼。在{{}}中，您會在控制檯中看到第一次迭代。

graphWorkerType = {}; 

$.each(skillCountPerType, function(key, value) { 
    console.log(key); { 
     { 
      full - time 
     } 
    } 
    console.log(value); { 
     { 
      Object { 
       PHP: 1, 
       NoSQL: 1, 
       WebEX: 1, 
       Facebook: 1, 
       WordPress: 1… 
      } 
      Access: 1 
      Excel: 2 
      Facebook: 1 
      NoSQL: 1 
      PHP: 1 
      WebEX: 1 
      WordPress: 1 
     } 
    } 

    $('#typeUser').append('<option value="' + key + '">' + key + '</option>'); 

    skillsforGraph = JSON.stringify(skillCountPerType[value]); 
    console.log(skillsforGraph); { 
     { 
      { 
       "PHP": 1, 
       "NoSQL": 1, 
       "WebEX": 1, 
       "Facebook": 1, 
       "WordPress": 1, 
       "Excel": 2, 
       "Access": 1 
      } 
     } 
    } 

    graphWorkerType[key] = new Array(); 

    $.each(value, function(key2, value2) { 
     graphWorkerType[key].push(key2); 
    }); 

    console.log(graphWorkerType); { 
     { 
      Object { 
       full - time: Array[7], part - time: Array[5] 
      } 
      full - time: Array[7] 
      0: "PHP" 
      1: "NoSQL" 
      2: "WebEX" 
      3: "Facebook" 
      4: "WordPress" 
      5: "Excel" 
      6: "Access" 
      part - time: Array[5] 
      0: "WordPress" 
      1: "XML" 
      2: ".NET" 
      3: "Adobe Photoshop" 
      4: "Visual Basic" 
     } 
    } 
});

來源

2015-04-24 Nicholas Darley

在您的第一個console.log語句之後：確切的輸出是不可能的，因爲它不是有效的JSON。如果它以花括號開始，它是一個對象，並且必須具有與其內的每個值相關聯的鍵。（所以它會是'{myEntry：{「PHP」：1 ...'，而不是'{{「PHP」：1 ...'。我可以弄清楚這一點，但對我來說會更容易如果你沒有編寫修改過的僞代碼，可視化編輯：剛纔看到你對雙花括號的評論，也許你可以改成'//註釋？花括號有它們自己的含義，並且有點令人困惑。 – Katana314

修改本節

graphWorkerType[key] = new Array(); 
$.each(value, function(key2, value2) { 
     graphWorkerType[key].push(key2); 
});

與

graphWorkerType[key] = { labels: [], values: []}; 
$.each(value, function(key2, value2) { 
    graphWorkerType[key]['labels'].push(key2); 
    graphWorkerType[key]['values'].push(value2); 
});

然後，你可以通過你的graphWorkerType對象到圖表

來源

2015-04-24 17:10:46 devconcept

這適用於我，非常感謝你現在只需要找到一種方法來動態創建圖表的數據集，可能會使用另一個$ .each我的原始兩個之外。 –

您可以將JavaScript對象轉換爲JSON與JSON.stringify（）

來源

2015-04-24 17:01:00 Taplar

將JavaScript對象轉換爲JSON字符串以獲得密鑰和值

回答

相關問題