如何在 JavaScript 中查詢陣列的長度？

在本教程中，我們將學習如何在 JavaScript 中查詢陣列長度的方法。陣列的長度是指 JavaScript 陣列包含的元素或專案的數量。在 JavaScript 中，我們只有一種方法或方法可以找出陣列的長度。

  • 使用 length 屬性

使用 length 屬性

在 JavaScript 中，我們可以使用 JavaScript 的length屬性來查詢陣列的長度。正如我們所知，陣列的長度是陣列包含的元素的數量，length屬性將返回一個表示陣列長度或其中元素數量的單個數字。

讓我們看看如何使用length屬性在 JavaScript 中查詢陣列的長度。

語法

以下語法將解釋如何在 JavaScript 中使用length屬性來查詢陣列的長度 -

let arr = [];
let len = arr.length;

使用上述語法，我們可以查詢陣列的長度，甚至可以使用此語法設定陣列的長度。

步驟

  • 步驟 1 - 首先，我們需要定義我們將使用 JavaScript 語法定義陣列的陣列的長度。
  • 步驟 2 - 在下一步中，我們將使用如上語法所示的length來查詢陣列長度或其內部的元素數量。
  • 步驟 3 - 第三步將包含顯示上述步驟結果的邏輯，以便從這些步驟中得出陣列的長度。

讓我們藉助程式碼示例瞭解上述方法的實現。

示例 1

以下示例將說明如何在 JavaScript 中使用 length 屬性查詢陣列的長度 -

<html>
<body>
   <h3>Finding the length of an array in JavaScript</h3>
   <p>The Dummy array is: [25, 38, 36, 20, 35]</p>
   <p id="result"></p>
   <script>
      let arr = [25, 38, 36, 20, 35];
      let len = arr.length;
      document.getElementById('result').innerHTML = "The length of above array is: " + len;
   </script>
</body>
</html>

在上面的示例中，我們使用arr作為虛擬陣列，使用 JavaScript 中的 length 屬性查詢長度。

以下示例將解釋如何在 JavaScript 中使用length屬性查詢陣列的長度，當在陣列的初始化中缺少某些元素時。

讓我們看看當陣列中缺少一個或多個元素時，length將返回什麼 -

示例 2

<html>
<body>
   <h3>Find the length of an array in JavaScript</h3>
   <p>The Dummy array is: [,54,63, ,26,48,10, ,15, ]</p>
   <p id="result"></p>
   <script>
      let arr = [, 54, 63, , 26, 48, 10, , 15];
      let len = arr.length;
      document.getElementById('result').innerHTML = "The length of above array is: " + len ;
   </script>
</body>
</html>

在上面的示例中，我們可以清楚地看到在陣列arr的宣告中缺少三個元素，但length屬性仍然返回陣列的長度為 9，這意味著它也計算了宣告中缺少的專案作為其包含的專案，這就是為什麼它顯示陣列的長度為 9 的原因。

示例 3

現在，在這個例子中，我們將看到如果在宣告陣列之後從陣列中新增或刪除一個或多個專案，length屬性將返回什麼值。

<html>
<body>
   <h3>Find the length of an array in JavaScript</h3>
   <p>The Dummy array was: ["Potato", "Tomato", "Onion"]</p>
   <p id="result"></p>
   <script>
      let veggies = ["Potato", "Tomato", "Onion"];
      veggies.push("Ladyfinger");
      veggies.push("Cabbage");
      veggies.pop();
      let len = veggies.length;
      document.getElementById('result').innerHTML = "The length of above array is: " + len + "</br>" + "<br>While the array after modification is: " + veggies + "";
   </script>
</body>
</html>

在這個例子中，我們使用veggies聲明瞭一個蔬菜陣列，我們使用 JavaScript 的push()和pop()方法分別修改聲明後的陣列以新增和刪除陣列的元素，其中pop()方法預設總是刪除陣列的最後一個元素。在這種情況下，我們使用push()方法將兩個專案Ladyfinger和Cabbage推入陣列，但後來我們使用pop()方法從陣列中彈出了一個元素，它刪除了最後一個元素，在本例中為Cabbage。因此，我們得到陣列的長度為4，並且螢幕上只打印了四個元素。

在本教程中，我們學習瞭如何使用length屬性在 JavaScript 中查詢陣列的長度，並且還了解了length屬性如何在宣告陣列的不同場景或條件下做出反應或執行，並使用相應的程式碼示例。

更新於: 2022-10-31

13K+ 瀏覽量

開啟你的 職業生涯

透過完成課程獲得認證

開始學習
廣告

© . All rights reserved.