Item practical traversal number groups for,forEach,map

In a project, lists are usually processed in a loop, such as filtering, valuing, and so on. There are usually three ways to do this.

A,forLoop This is the most basic loop and the most common one.let list=[{"id": 0."title":"First title"}, {"id": 1,"title":"Chinaman"}, {"id": 2."title":"Very good"}]
    let ListHtml=' ';
    for(leti=0; i<list.length; i++){ ListHtml+='<h3>'+list[i].title+'</h3>'
    }
    document.getElementById('listPage'.innerhtml =ListHtml is also availableforOf orfor in
 for(let value of list){
        ListHtml+='<h3>'+value.title+'</h3>'
 }
 
 for(let index in list){
        ListHtml+='<h3>'+list[index].title+'</h3>'} The difference between the two is,forOf can loop through pure arrays, like arrays Set() and Map(), but not objects.for inYou can loop objects.let obj={id:0,name:'xxx'};
for(v in obj){
    console.log(v); //  0,xxx
}
for(v of obj){ console.log(v); / / error}let s=new Set();
s.add(1).add(2).add(3);
for(v of s){console.log(v) //1,2,3}for(v inS){console.log(v) // no response}let m =new Map();
m.set(1,'a');
m.set('a',2).set(3,'b');

for(v of m){
    console.log(v) //  [1, "a"] ["a", 2] [3, "b"]}for(v inM){console.log(v) // No print information}forEach
forList. ForEach (((value, index, array) => {console.log(value) //{id: 0, title:"First title"}... List. Map (((value, index) => {console.log(value) //{id: 0, title:"First title"}... Console. log(index) //0,1,2})) map andforThe difference between Each is thatforEach, however, returns undefined, whereas map returns a new array eg:let result= list.map(((value, index) => {
       returnValue}) console.log(result) // Returns a new arraylet result= list.forEach(((value, index) => {
       returnValue}) console.log(result) // returns undefinedCopy the code

It may be more or less useful in real projects, but the method is not fixed.