for of 循环和解构

Question

有人可以向我解释 map.entries() 和解构究竟是如何工作的吗？

  var numbers = new Map()
      numbers.set(1,'one')
      numbers.set(2,'two')
      numbers.set(3,'three') 
      numbers.set(4,'four')
  var [key,value] = numbers.entries() // returns key as [1,'one'] and value as [2,'two']

   //but when using for..of loop 

  for(let [key,value] of numbers.entries()){
   console.log(key,value)
 } // it works and console logs keys and values

为什么这在 for..loop 中起作用？ .entries() 方法究竟是如何工作的？我一直在网上寻找，但并不能真正理解它。

Answer 1

你的第一个作业这样更容易理解：

var [set1, set2, set3, set4] = numbers.entries();

上面的代码片段解构了键值对（集合）。

另一方面，您的 for 循环遍历 map 并逐个获取每个设置项。当你放置 let [key, value] 时，你实际上是在解构集合本身。

因此，您的 for 循环遍历集合项，然后对于每个集合项，它使用解构来分配键和值

Answer 2

在您的第一种情况下，numbers.entries() 代表一个数组，其中包含地图中的每个条目。

var [key,value] = numbers.entries();

key 是 numbers.entries() 数组中第一个索引 (0) 处的元素，value 是第二个，如果您希望对第三个进行解构属性，例如elem，代表[3, 'three']等。

在你的第二种情况下，你正在遍历 numbers.entries() 数组，所以在每个循环中你只会得到该数组中的一个元素。

for (let [key, value] of numbers.entries())

我们简化一下：

for (let singleElement of numbers.entries())

因此在每个循环中，singleElement 代表 numbers.entries() 中的每个嵌套数组。

所以第一个循环将是[1, 'one']，解构后将计算为key为1和value为one等。

let [key, value] = singleElement; // [1, 'one']

如果您想了解有关 Map 的更多信息，请考虑查看：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

Answer 3

entries方法returns一个迭代器。迭代器产生的每个值都是一个 key/value 对（包含 2 个元素的数组）。

掌握这一点的一种方法是，看看如果将迭代器消耗到新数组中会发生什么：

var numbers = new Map().set(1,'one').set(2,'two').set(3,'three').set(4,'four');

// Get everything from the iterator into a new array:                           
var arr = Array.from(numbers.entries());

console.log(arr);

请注意，您将一系列 key/value 对放入一个新数组中：

[ [1, "one"], [2, "two"], [3, "three"], [4, "four"] ]

现在开始你的代码。对 key 和 value 的第一个赋值具有误导性，因为您没有获得一个键和一个值。相反，您正在获取 entries() 迭代器产生的前两对。

如果你真的想得到第一个键和2个变量中对应的值，你需要这样写：

var [[key, value]] = numbers.entries();

for of 循环和解构

for of loop and destructuring

javascript

destructuring

for-of-loop