📜  JavaScript 映射 forEach() 方法

📅  最后修改于: 2022-05-13 01:56:22.499000             🧑  作者: Mango

JavaScript 映射 forEach() 方法

下面是Map.forEach()方法的示例

Javascript

    // Creating a map using Map object
    let mp=new Map()
     
    // Adding values to the map
    mp.set("a",1);
    mp.set("b",2);
    mp.set("c",3);
     
    // Logging map object to console
    mp.forEach((values,keys)=>{
      document.write(values,keys+"<br>")
    })
1a2b3c


HTML

 
    // Creating a map using Map object
    let mp=new Map()
     
    // Adding values to the map
    mp.set("a",65);
    mp.set("b",66);
    mp.set("c",67);
    mp.set("d",68);
    mp.set("e",69);
    mp.set("f",70);
     
    // Logging map object
    document.write(mp+ "<br>");
    mp.forEach((values,keys)=>{
      document.write("values: ",values+
                     ", keys: ",keys+ "<br>")
    })


HTML



  
  
  Document


  
  
  
    // Creating a map using Map object
    let mp=new Map()
    //adding values to the map
    mp.set("a",65);
    mp.set("b",66);
    mp.set("c",67);
    mp.set("d",68);
    mp.set("e",69);
    mp.set("f",70);
    //logging map object to console
    document.log(mp);
    let ul=document.querySelector("ul");
    mp.forEach((values,keys)=>{
      ul.innerHTML+=ul.innerHTML="<li>"+keys+" =>"+values+"</li>"
    })
  



输出:

1a
2b
3c

Map.forEach方法用于使用给定函数循环映射,并在每个键值对上执行给定函数。

句法:

myMap.forEach(callback, value, key, thisArg)

参数:此方法接受上面提到的四个参数,如下所述:

  • 回调:这是在每个函数调用上执行的函数。
  • value:这是每次迭代的值。
  • key:这是达到迭代的关键。
  • thisArg:这是执行回调时用作 this 的值。

返回:它返回未定义的值。

上述方法的代码如下:
方案一:

HTML


 
    // Creating a map using Map object
    let mp=new Map()
     
    // Adding values to the map
    mp.set("a",65);
    mp.set("b",66);
    mp.set("c",67);
    mp.set("d",68);
    mp.set("e",69);
    mp.set("f",70);
     
    // Logging map object
    document.write(mp+ "<br>");
    mp.forEach((values,keys)=>{
      document.write("values: ",values+
                     ", keys: ",keys+ "<br>")
    })

输出:

[object Map]
values: 65, keys: a
values: 66, keys: b
values: 67, keys: c
values: 68, keys: d
values: 69, keys: e
values: 70, keys: f

方案二:

HTML




  
  
  Document


  
  
  
    // Creating a map using Map object
    let mp=new Map()
    //adding values to the map
    mp.set("a",65);
    mp.set("b",66);
    mp.set("c",67);
    mp.set("d",68);
    mp.set("e",69);
    mp.set("f",70);
    //logging map object to console
    document.log(mp);
    let ul=document.querySelector("ul");
    mp.forEach((values,keys)=>{
      ul.innerHTML+=ul.innerHTML="<li>"+keys+" =>"+values+"</li>"
    })
  


输出:

支持的浏览器:

  • 谷歌浏览器 38 及以上
  • Microsoft Edge 12 及更高版本
  • Mozilla Firefox 25 及更高版本
  • Internet Explorer 11 及更高版本
  • Safari 8 及更高版本
  • 歌剧 25岁及以上