如何從數組中刪除一個空對象？

Question

我有一個JavaScript對象數組，單擊按鈕時，我將一個對象推入數組，然后將其用作網格的數據源。 我面臨的問題是，數組中的第一個對象最初都是空值，並且當我加載網格時，由於有空對象，我有一個空白行。如何在加載前從數組中刪除該空對象網格？

這是數組

var gridData = {
    step3GridData: [{ Description: "", Color: "", SqSiding: "" }]
};

然后單擊一個按鈕，將一個新對象推送到數組

gridData.step3GridData.push({ Description: $("#InfoInsul").text(), Color: $("#ddGetInsulationMaterialColor").val(), SqSiding: $("#ddInsulationSquares").val() });

LoadStep3(gridData.step3GridData);

如前所述，在將負載與數組綁定之前，需要刪除該空對象。 我將如何去做呢？

Answer 1

使用拼接 。 如果確定它始終是數組中的第一項，則可以執行以下操作：

if (gridData.length && Object.keys(gridData[0]).length === 0) {
  gridData.splice(0, 1);
}

如果不確定其位置，則可以遍歷數組並刪除第一個空對象：

for (const [idx, obj] of gridData.entries()) {
    if (Object.keys(obj).length) === 0) {
        gridData.splice(idx, 1);
        break;
    }
}

Answer 2

首先，像這樣初始化數組：

var gridData = {
    step3GridData: [] // empty array
};

然后，當您推動一個新對象時，檢查輸入是否像這樣填充：

var desc = $("#InfoInsul").text();             // this seems unnecessary as this is not left to the user to fill (if I'm assuming right then don't check if this is empty)
var col = $("#ddGetInsulationMaterialColor").val();
var sqs = $("#ddInsulationSquares").val();
if(desc.length && col.length && sqs.length) { // if desc is not empty and col is not empty and sqs not empty then add an object
    gridData.step3GridData.push({ Description: desc, Color: col, SqSiding:  });
}

現在，如果用戶將某些東西留空，則該對象將不會被推入，因此將沒有空的對象。 您可以利用else來警告消息，指出用戶將某些輸入留空。