JavaScript - Array values() 方法



陣列是 JavaScript 中一種用於在單個變數中儲存多個值的資料結構。陣列中的每個值稱為元素,每個元素都有一個唯一的索引。

在 JavaScript 中,Array.values() 方法不接受任何引數,並返回一個新的陣列迭代器物件,該物件包含陣列的值,按照插入順序排列。可以使用 for...of 迴圈或 next() 方法透過此迭代器物件迭代陣列的值。

values() 方法幾乎與所有瀏覽器相容,例如 Chrome、Edge、FireFox、Opera 和 Safari。

語法

以下是 JavaScript Array.values() 方法的語法:

values()

引數

此方法不接受任何引數。

返回值

此方法返回一個新的可迭代迭代器物件,其中包含陣列的值。

示例

示例 1

在下面的示例中,我們使用 values() 方法建立一個迭代器物件。然後,我們使用迭代器上的 next() 方法手動檢索每個元素。

<html>
<body>
   <script>
      let array = ['apple', 'banana', 'cherry'];
      let iterator = array.values();
      document.write(iterator.next().value, "<br>");
      document.write(iterator.next().value, "<br>");
      document.write(iterator.next().value);
   </script>
</body>
</html>

執行上述程式後,它將按插入順序列印陣列的所有元素。

輸出

apple
banana
cherry

示例 2

在此示例中,我們使用 values() 方法迭代陣列的元素,並使用 values() 方法的結果中的 for...of 迴圈按插入順序列印它們。

<html>
<body>
   <script>
      let array = ['apple', 'banana', 'cherry'];
      let iterator = array.values();
      for (let value of iterator) {
         document.write(value, "<br>");
      }
   </script>
</body>
</html>

如果我們執行上述程式,它將按插入順序列印陣列的所有元素。

輸出

apple
banana
cherry

示例 3

在這裡,我們使用 Array.from() 方法建立一個新的陣列,其中包含 values() 方法返回的值。Array.from() 方法建立陣列的淺複製,因此原始陣列保持不變。

<html>
<body>
   <script>
      let array = ['apple', 'banana', 'cherry'];
      let valuesArray = Array.from(array.values());
      document.write(valuesArray);
   </script>
</body>
</html>

執行上述程式後,它將按插入順序列印陣列的所有元素。

輸出

apple,banana,cherry

示例 4

在此示例中,我們建立一個稀疏陣列,其中在索引 1、3 和 5 處有三個元素。當我們使用 values() 方法建立迭代器物件時,迭代器物件對陣列中沒有值的索引返回 undefined。

<html>
<body>
   <script>
      let array = [];
      array[1] = 'apple';
      array[3] = 'banana';
      array[5] = 'cherry';
      let iterator = array.values();
      document.write(iterator.next().value, <br>); //undefined
      document.write(iterator.next().value, <br>); //'apple'
      document.write(iterator.next().value, <br>); //undefined
      document.write(iterator.next().value, <br>); //'banana'
      document.write(iterator.next().value, <br>); //undefined
      document.write(iterator.next().value); //'cherry'
   </script>
</body>
</html>

正如我們在輸出中看到的,它對索引 (0, 2, 4) 返回了 'undefined',並對 (1, 3, 5) 返回了關聯的值。

廣告