JavaScript 中查詢 JSON 物件長度的最佳方法

本文介紹了在 JavaScript 中查詢 JSON 物件長度的最佳方法。

輸入-輸出場景

讓我們來看一下這個輸入-輸出場景。假設有一個物件，其中包含一些鍵值對。我們需要獲取該物件的長度。

const MyObj = {
   Name: "Mike",
   Age: 34 
};
document.write(Object.keys(MyObj).length);
// Output: 2

使用 Object.keys()

Object.keys() 方法將返回給定物件自身可列舉屬性名稱的陣列形式的輸出。它將按物件中存在的順序返回鍵的輸出。

語法

以下是 Object.keys() 的語法

Object.keys(obj)

其中引數 (obj) 是要返回其可列舉自身屬性的物件。此方法將以字串陣列的形式返回所有物件的列舉屬性。

示例 1

在下面的示例中，我們聲明瞭一個物件並透過簡單的屬性初始化器建立了屬性，因此預設情況下所有屬性都是可列舉的。現在我們使用了object.keys()方法以陣列形式返回物件的列舉鍵。

<!DOCTYPE html>
<html>
<head>
   <title>Length of object in JavaScript</title>
</head>
<body>
   <p id = "para1"> </p>
   <p id = "para2"> </p>
   <script>
      var Films = {'Liger':'Puri Jagannadh', 'Bahubali':'Rajamouli','Pushpa': 'Sukumar'};
      var arr = Object.keys(Films);
      document.getElementById("para1").innerHTML = "Keys of the object are: " + arr;
   </script>
</body>
</html>

從輸出中我們可以看到，Object.keys() 方法返回了一個包含物件鍵的陣列 -

示例 2

在下面的示例中，我們聲明瞭一個物件，並透過簡單的屬性初始化器建立了一些屬性，這些屬性預設情況下是可列舉的。我們返回了包含物件鍵的陣列。現在，我們將length屬性分配給 object.keys() 方法以獲取物件的整數長度。

<!DOCTYPE html>
<html>
<head>
   <title>Length of object in JavaScript</title>
</head>
<body>
   <p id = "para1"> </p>
   <p id = "para2"> </p>
   <script>
      let Cinema = {
         Title: "Pokiri",
         Actor: "Mahesh babu",
         Actress: "Ileana",
         Result: "Industry-Hit"
      };
      let keysinobj = Object.keys(Cinema);
      document.getElementById("para1").innerHTML = "Keys in object: " + keysinobj + "<br>";
      document.getElementById("para2").innerHTML = "Length of keys are: " + keysinobj.length;
   </script>
</body>
</html>

在輸出中，我們可以看到 object.keys() 正在返回物件的所有鍵，並且 length 屬性正在給出物件中鍵的數量。

hasOwnProperty()

JavaScript 中的hasOwnProperty()方法將讓你知道物件是否具有特定的屬性作為其自身屬性。此方法將以布林值返回輸出。

語法

以下是 hasOwnProperty() 的語法：

hasOwnProperty(prop)

其中引數 (prop) 是要測試的屬性的名稱。如果物件具有指定的屬性作為自身屬性，則返回 true，否則返回 false。

示例

使用 for…in 迴圈

在示例中，我們有一個物件和預設情況下可列舉的屬性。現在，為了獲取物件的長度，我們透過 for...in 迴圈迭代了物件。我們將物件的屬性作為引數傳遞給 hasOwnProperty()，每當物件的特定屬性是其自身屬性時，它都會遞增最初初始化為 0 的大小。然後我們透過將Student傳遞給Object.size來返回物件的長度。

<!DOCTYPE html>
<html>
<head>
   <title>Length of object in JavaScript</title>
</head>
<body>
   <p id = "para1"> <p>
   <script>
      const Student = {
         name: "Sarika",
         age: 16,
         grade: 10,
         school: "Sunbeam school bhagwanpur",
      };
      Object.size = function(Student) {
         let size = 0, key;
         for (key in Student) {
            if (Student.hasOwnProperty(key)){
               size++
            };
         };
         return size;
      };
      const length = Object.size(Student);
      document.getElementById("para1").innerHTML = "Length of object is: " + length;
   </script>
</body>
</html>

從輸出中我們可以看到，每當 hasOwnProperty() 返回該屬性是物件自身屬性時，大小都會遞增。並且大小被分配給 length 變數，我們列印它以獲取物件的長度。

更新於: 2022年9月22日

15K+ 閱讀量

開啟你的 職業生涯

透過完成課程獲得認證

開始學習
廣告