將JSON對象添加到JSON對象

我有一個JSON對象僱員，我想用我的localstorage中的數據填充。我首先使用stringify()將我的JSON對象保存到本地存儲。將JSON對象添加到JSON對象

sessionStorage.setItem('Employee3', JSON.stringify({id: 3, firstName: 'Dwight', lastName: 'Schrute', title: 'Assistant Regional Manager', managerId: 2, managerName: 'Michael Scott', city: 'Scranton, PA', officePhone: '570-444-4444', cellPhone: '570-333-3333', email: '[email protected]', reportCount: 0}));

現在我想填充我的員工對象：

employees: {}, 

populate: function() { 
    var i = i; 
    Object.keys(sessionStorage).forEach(function(key){ 
     if (/^Employee/.test(key)) { 
      this.employees[i] = $.parseJSON(sessionStorage.getItem(key)); 
      i++; 
     } 
    }); 
},

$.parseJSON(sessionStorage.getItem(key))正確返回JSON對象的功能。在分配給員工對象失敗：

遺漏的類型錯誤：未定義

來源

2013-05-16 Hazaart

'employees'是，而你是把它當作一個數組的對象。如何聲明'僱員'數組？ – shahkalpesh

在原始代碼片段中，他們沒有使用localstorage，現在我添加它。他們把它當作一個數組來處理：this.employees [4] = {id：4，firstName：'Jim'，lastName：'Halpert'，標題：'Assistant Regional Manager'，managerId：2，managerName：'Michael Scott'，city：'Scranton，PA'，office phone：'570-222-2121'，cellPhone：'570-999-1212'，email：'[email protected]'，reportCount：1}; – Hazaart

@shahkalpesh：這是不正確的。在JavaScript中，您可以使用方括號訪問對象的屬性。它並不意味着訪問數組的索引 – Kenneth

Array.forEach不保留this，所以你必須保持它自己。無論這些就可以了（見mdn）：

Object.keys(sessionStorage).forEach(function(key){ 
    if (/^Employee/.test(key)) { 
     this.employees[i] = $.parseJSON(sessionStorage.getItem(key)); 
     i++; 
    } 
}, this); 

var self = this; 
Object.keys(sessionStorage).forEach(function(key){ 
    if (/^Employee/.test(key)) { 
     self.employees[i] = $.parseJSON(sessionStorage.getItem(key)); 
     i++; 
    } 
});

另外，還要考慮使用瀏覽器的JSON.parse()，而不是jQuery的。任何支持Array.forEach的瀏覽器都將支持JSON.parse()。

來源

2013-05-16 14:49:46 tjameson

或者在迭代器函數中使用'.bind（this）'。 –

如果您使用的是jQuery，那麼沒有理由使用'JSON.parse' - jQuery會嘗試使用它，然後回退到另一種方法。我寧願使用它，而不是確定 – Ian

@MerynStol - 這隻會在OP只想使用該數組的一個上下文時起作用，因爲不能覆蓋該數據。請參見[mdn]（https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind）。 – tjameson

「未定義」無法設置屬性你必須與this的forEach回調中的價值問題。另外，你不需要jQuery來解析JSON。

你可以這樣做，而不是：

employees: {}, 

populate: function() { 
    var that = this; 
    var i = i; 
    Object.keys(sessionStorage).forEach(function(key){ 
     if (/^Employee/.test(key)) { 
      that.employees[i] = JSON.parse(sessionStorage.getItem(key)); 
      i++; 
     } 
    }); 
},

來源

2013-05-16 14:47:22 bfavaretto

'此外，你不需要jQuery來解析JSON.' - 那麼爲什麼你的答案仍然有'$ .parseJSON'？ :) – Ian

@Ian謝謝你指出這一點，我匆忙編輯我的答案，並剪掉了錯誤的部分。 – bfavaretto

你必須與this範圍的問題。當你在foreach回調中時，這不是指正確的實例。

您需要參考保存到this之前，然後通過參考訪問對象（在下面的例子中個體經營）：

function something(){  
    var self = this; 
    ** snip ** 
    employees: {}, 

    populate: function() { 
     var i = i; 
     Object.keys(sessionStorage).forEach(function(key){ 
      if (/^Employee/.test(key)) { 
       self.employees[i] = $.parseJSON(sessionStorage.getItem(key)); 
       i++; 
      } 
     }); 
    }, 
    ** snip ** 
}

來源

2013-05-16 14:49:21 Kenneth

還有一種方法：

Object.keys(sessionStorage).forEach((function(key){ 
    if (/^Employee/.test(key)) { 
     this.employees[i] = $.parseJSON(sessionStorage.getItem(key)); 
     i++; 
    } 
}).bind(this));

調用上的功能.bind(this)將返回綁定到值this新功能（在當前範圍）。

這樣做的好處是您不需要記住哪些方法支持第二個「this for this」參數。它始終有效。例如，這也適用於將事件偵聽器添加到DOM節點的情況。

tjameson的第一個建議可能是在這個特定情況下首選。

來源

2013-05-16 14:59:17

技術上有效，+1爲獨特的解決方案。 – tjameson

沒有理由來解析JSON，兩個簡單的功能，將做的工作（希望他的想法）：

var employees = {}; 

function setEmployee(data) { 
    var id = data.id; 
    sessionStorage.setItem('Employee' + id, JSON.stringify(data)); 
}; 

function getEmployee(id) { 
    employees[id] = sessionStorage.getItem('Employee' + id); 
}; 

var oneEmployee = { 
    id: 3, 
    firstName: 'Dwight', 
    lastName: 'Schrute', 
    title: 'Assistant Regional Manager', 
    managerId: 2, 
    managerName: 'Michael Scott', 
    city: 'Scranton, PA', 
    officePhone: '570-444-4444', 
    cellPhone: '570-333-3333', 
    email: '[email protected]', 
    reportCount: 0 
}; 

setEmployee(oneEmployee); 

getEmployee(3);

來源

2013-05-16 15:07:40 skobaljic

將JSON對象添加到JSON對象

回答

相關問題