使用空JSON對象處理

我是JSON和jQuery的新手。我正在做的是從api獲取JSON對象並將其顯示爲表格。但JSON數組中的某些元素爲空使用空JSON對象處理

例如; JSON數組是這樣的：

[ 
    {"key":"first" , "name" :{"last":"Owen"} , "age" :{"number": 18} }, 
    {"key":"second" , "name" : null , "age" :{"number": 20} } , 
    {"key":"third" , "name" : {"last":"Jay"} , "age" :null } 
]

所以輸入到表格中，我這樣做：

$.each(jsonarray, function(i,data){ 
$("<tr>").append(
    $.('<td>').text(data.key), 
    $.('<td>').text(data.name.last), 
    $.('<td>').text(data.age.number)).appendTo('.table'); 
});

這樣的事情是，他們將得到錯誤：

Cannot read property 'last' of null ; Cannot read property 'number' of null

因爲在第二個和第三個元素中，name是null，age是null。因此，有沒有這樣的事情是name.last和age.number在增加。

我想要的是，每當他們得到類似的東西，又自動回到「無信息」添加到表

不過，我還是不知道該怎麼做。我確實嘗試寫一個函數來檢查。例如像這樣：

function check1(datum){ 
    if (datum !== null && datum !== undefined){ 
     return datum.last; 
    } 
    else { 
     return "No Information" 
    } 
} 
    function check2(datum){ 
    if (datum !== null && datum !== undefined){ 
     return datum.number; 
    } 
    else { 
     return "No Information" 
    } 
}

但它是非常乏味，因爲我需要編寫2個單獨的函數來檢查（1爲名稱和1爲年齡）。我只是想知道是否有任何優雅的方法可以爲所有人完成一項功能？

來源

2017-09-15 Ngoc Tuan Lam

請總結一下就是：

function checkForNull(item) { var data = "No information"; if(!item === null) { data = item; } return data; }

然後，你可以按如下方式使用它確切的問題。你想遍歷這個JSON數組還是你得到任何空值？ – Arora20

我希望每當遇到空時，他們會給我「沒有信息」添加到表中，而不是拋出錯誤 –

這可以滿足您的需求嗎？

var noDataTip = 'No Information'; 
$.each(jsonarray, function(i,data) { 
    $("<tr>").append(
    $('<td>').text(data.key), 
    $('<td>').text((data.name && data.name.last) || noDataTip), 
    $('<td>').text((data.age && data.age.number)) || noDataTip).appendTo('.table'); 
});

來源

2017-09-15 07:56:49 JiangangXiong

Fanstatic，它的工作原理。謝謝 –

對不起，但你能幫我解釋這種邏輯，我很困惑它如何工作 –

'（data.name && data.name.last）'意味着只有'data.name'存在，那麼下一個' data.name.last'將會運行，如果存在，此語句將返回'data.name.last'的值，否則將返回'data.name'的值; – JiangangXiong

試試這個。 :)

$.each(jsonarray, function(i,data){ 
    if(data.key === undefined || data.key === null){ 
     data.key = 'none'; 
    } 
    if(data.name === undefined || data.name === null){ 
     data.name = 'none'; 
    } 
    if(data.age === undefined || data.age === null){ 
     data.age = 'none'; 
    } 
    $("<tr>").append(
     $.('<td>').text(data.key), 
     $.('<td>').text(data.name.last), 
     $.('<td>').text(data.age.number) 
    ).appendTo('.table'); 
});

來源

2017-09-15 08:00:08

$.each(jsonarray, function(i,data){ 
     $("<tr>").append(
     $.('<td>').text(data.key), 
     $.('<td>').text(data.name && data.name.last ? data.name.last : "No Information"), 
     $.('<td>').text(data.age && data.age.number ? 
data.age.number : "No Information").appendTo('.table'); 
    });

來源

2017-09-15 08:02:29

謝謝大家，這個也有效，這是一個條件運算符嗎？ –

這是內聯的if，else函數。使其更短，更清潔，更易於在此代碼中讀取 –

，您首先要確保存在data.name或data.age。如果是這樣，那麼你檢查data.name.last或data.age.number是否存在，如果他們這樣做，那麼你在'？'後面返回語句。否則你在'：'之後返回語句。這是內聯if語句的簡短形式。你可以在很多語言中使用它。你可以在這裏閱讀更多信息https://docs.microsoft.com/en-us/scripting/javascript/reference/conditional-ternary-operator-decrement-javascript –

我會寫一個函數，使一個簡單的檢查空：

$.('<td>').text(checkForNull(data.key))

來源

2017-09-15 08:04:40

使用空JSON對象處理

回答

相關問題