typescript - 学习循环地图问题

Question

我一直在关注关于 ES6/Typescript 和 Map 结构使用的在线教程。

位置：https ://codecraft.tv/courses/angular/es6-typescript/mapset/

问题是循环中根本没有显示任何内容。我已经比较了我在教程中写的内容，我一生都无法理解为什么它不会在 for 循环中输出数据。

有人能告诉我为什么当教程视频上的代码显示它不起作用时这不起作用吗？

这是代码

function mapDisplay(){
        let ddData = new Map([
          ["this", 11],
          ["doesnt", 21],
          ["work", 31]
        ])
    
        console.log('show ddData');
        console.log(ddData);
    
        console.log('show key');
        // Loop over our Map using keys function
        for (let key of ddData.keys()) {
          console.log(key);
        }
    
        console.log('show values')
        // Loop over our Map using values function
        for (let val of ddData.values()) {
          console.log(val);
        }

        console.log('show entries')
        // Loop over our Map using entries function
        for (let entry of ddData.entries()) {
          console.log(entry[0], entry[1]);
        }
      }
    
      mapDisplay();

我在输出控制台中看到的是这个。如您所见，循环没有输出：

标签： typescriptes6-map

Answer 1

Map.values()/Map.keys() 返回一个迭代器对象 [ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/values。您应该使用 Array.from() 转换为 Array。

请参阅以下代码 -

function mapDisplay(){
    let ddData = new Map([
      ["this", 11],
      ["doesnt", 21],
      ["work", 31]
    ]);

    console.log('show ddData');
    console.log(ddData);

    console.log('show key');
    // Loop over our Map using keys function
    for (let key of Array.from(ddData.keys())) {
      console.log(key);
    }

    console.log('show values')
    // Loop over our Map using values function
    for (let val of Array.from(ddData.values())) {
      console.log(val);
    }

    console.log('show entries')
    // Loop over our Map using entries function
    for (let entry of Array.from(ddData.entries())) {
      console.log(entry[0], entry[1]);
    }
  }

  mapDisplay();