在 JavaScript 中，對象是最重要的數(shù)據(jù)類型，我們在使用 JavaScript 框架開發(fā)應(yīng)用程序時大部分時間都需要它。有時，我們需要檢查一個對象是否為空，并根據(jù)對象值執(zhí)行操作。
例如，您正在從數(shù)據(jù)庫中獲取數(shù)據(jù)；如果沒有找到，你可以獲得一個空對象。當(dāng)您對空對象執(zhí)行某些操作或執(zhí)行某些方法時，它會在程序中引發(fā)錯誤。因此，最好先檢查對象是否為空。
我們將學(xué)習(xí)三種使用 JavaScript 檢查對象是否為空的方法。
使用Object.keys()方法
我們可以使用Object.keys()方法來獲取單個數(shù)組中對象的鍵。之后，我們可以使用數(shù)組的 length 屬性檢查數(shù)組的長度。如果鍵數(shù)組的長度為0，則意味著該對象不包含任何鍵，并且該對象為空。
語法
用戶可以按照下面的語法使用Object.keys()方法檢查對象是否為空。
let obj1Len = Object.keys(obj1).length;
if (obj1Len == 0) {
// object is empty
} else {
// object is not empty
}
登錄后復(fù)制
在上面的語法中，Object.keys()返回obj1的所有鍵的數(shù)組，我們使用length屬性來獲取它的長度。使用上面的語法，我們可以使用 Object.keys() 方法獲取所有鍵的數(shù)組，并且我們還可以使用 length 屬性檢查數(shù)組的長度
示例
在下面的示例中，我們創(chuàng)建了兩個不同的對象。 obj1 包含一些屬性，而 obj2 為空且不包含任何單個屬性。
之后，我們對兩個對象使用 Object.keys() 方法來獲取鍵數(shù)組并檢查數(shù)組的長度以確保對象為空或至少包含一個屬性。
<html>
<body>
<h3>Using the<i> object.keys() </i>method to check whether the object contains some value or not</h3>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
let obj1 = {
prop1: 10,
prop2: "Hi",
};
let obj2 = {};
// get the array of all keys using the Object.keys() method,
// check the length of the array using the length property
let obj1Len = Object.keys(obj1).length;
if (obj1Len != 0) {
output.innerHTML += "The value of obj1 is " + JSON.stringify(obj1) + "</br>";
} else {
output.innerHTML += "The obj1 object is empty! </br>";
}
let obj2Len = Object.keys(obj2).length;
if (obj2Len != 0) {
output.innerHTML += "The value of obj1 is " + obj2 + "</br>";
} else {
output.innerHTML += "The obj2 object is empty! </br>";
}
</script>
</body>
</html>
登錄后復(fù)制
使用 for-in 循環(huán)
for-in 循環(huán)允許我們迭代對象的鍵。我們可以使用 for-in 循環(huán)遍歷對象的每個鍵。在這里，我們將使用 for-in 循環(huán)并檢查如果它對對象進(jìn)行了一次迭代，則該對象至少包含一個屬性并且不為空。
語法
用戶可以按照以下語法使用 for-in循環(huán)檢查對象是否為空。
function isObjectEmpty(object) {
for (ele in object) {
// object is not empty
return;
}
// if control comes here, the object is empty
}
登錄后復(fù)制
在上面的語法中，如果發(fā)生了 for 循環(huán)的單次迭代，則意味著我們已經(jīng)確保該對象至少包含一個屬性。因此，我們在 for-in 循環(huán)的第一次迭代之后使用 return 關(guān)鍵字終止該函數(shù)。
示例
在下面的示例中，我們創(chuàng)建了兩個不同的對象。此外，我們還創(chuàng)建了 isObjectEmpty() 函數(shù)，該函數(shù)根據(jù)對象是否為空打印不同的消息。
我們使用不同的對象調(diào)用了isObjectEmpty()函數(shù)兩次，用戶可以觀察其輸出。
<html>
<body>
<h3>Using the <i>for-in loop</i> to check whether the object contains some value.</h3>
<p id="output"></p>
<script>
let output = document.getElementById("output");
// creating the objects
let obj1 = {
prop1: false,
};
let obj2 = {};
// creating a function to check object is empty or not
function isObjectEmpty(object) {
for (ele in object) {
// if any single iteration occurs using a for-in loop, it means the object contains at least one property
output.innerHTML += "The object " + JSON.stringify(object) + " is not empty! </br>";
return;
}
output.innerHTML += "The object " + JSON.stringify(object) + " is empty! </br>";
}
// calling the isObjectEmpty() function by passing different objects as an argument
isObjectEmpty(obj1);
isObjectEmpty(obj2);
</script>
</body>
</html>
登錄后復(fù)制
使用 JSON.stringify() 方法
JSON.stringify() 方法將任何值轉(zhuǎn)換為我們作為該方法的參數(shù)傳遞的字符串。空對象的語法類似于 {}，stringify() 方法總是返回空對象的“{}”。
因此，我們可以將 stringify() 方法的返回值與“{}”進(jìn)行比較，確定該對象是否為空。
語法
用戶可以按照以下語法使用 JSON.stringify() 方法檢查對象是否為空。
if(JSON.stringify(education) == "{}") {
// object is empty
} else {
// object is not empty
}
登錄后復(fù)制
在上述語法中，如果 education 對象為空，JSON.stringify() 方法將返回“{}”。
示例
在下面的示例中，我們創(chuàng)建了 education 對象，其中包含一些屬性。因此，JSON.stringify()方法不會返回“{}”，但會返回 education 對象的字符串值。因此，用戶可以觀察到顯示教育對象不為空的輸出。
<html>
<body>
<h3> Using the<i> JSON.stringify() method </i> to check whether object contains some value or not.</h3>
<p id="output"></p>
<script>
let output = document.getElementById("output");
// creating the objects
let education = {
totalYears: 12,
school: "Online",
};
// convert object to string,
// if object is empty, the JSON.stringify() method will return "{}"
if (JSON.stringify(education) == "{}") {
output.innerHTML += "Object is empty!";
} else {
output.innerHTML += "Education object is not empty!";
}
</script>
</body>
</html>
登錄后復(fù)制
我們學(xué)習(xí)了三種檢查對象是否為空的方法。第一種和第三種方法只有一行代碼；用戶需要編寫 3 到 4 行才能使用第二行。因此，最好使用第一種和第三種方法中的任何一種，以獲得更好的代碼可讀性。
以上就是如何使用 JavaScript 檢查對象是否為空？的詳細(xì)內(nèi)容，更多請關(guān)注www.92cms.cn其它相關(guān)文章！
