[ES6] Itération deux structure Map

**sinzen** · 22/11/2017, 15h17

Salut à tous,

Pour effectuer des comparaisons,
Je voudrait itérer deux structure Map en javascript (en même temp).

je fait ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
function compare(map1, map2)
{
  map1.foreach((value, key) => {
      console.log("value of map1" + value);
      console.log("value of map2" + map2[value]);
  });
 }

mon 2e console affiche systemtiquement undifined

est-ce que j'itère bien sur ma 2e map ou je dois créer un boucle suplementaire?
il est possible d'utiliser la recursion avec une seule boucle ou sans ?
merci à vous.

**Watilin** · 22/11/2017, 17h22

Tu dois utiliser key

Exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
let bidule = { reponse: 42 };
console.log(bidule.reponse);
console.log(bidule["reponse"]);
 
let key = "reponse";
console.log(bidule[key]);

Du coup :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
function compare(map1, map2)
{
  map1.foreach((value, key) => {
      console.log("value of map1" + value);
      console.log("value of map2" + map2[key]);
      //.................................^^^...
  });
 }

est-ce que j'itère bien sur ma 2e map ou je dois créer un boucle suplementaire?
il est possible d'utiliser la recursion avec une seule boucle ou sans ?

Si tes deux maps sont identiques, tu peux les parcourir avec une seule et même boucle. Idem pour la récursion. Et si elles ne sont pas identiques, tu n’as pas besoin de continuer la comparaison, tu peux faire remonter le résultat.

Bon codage

**sinzen** · 22/11/2017, 19h49

Merci pour ta réponse Watilin.

ça marche pour moi comme ceci (Map):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
console.log("map1 => ", value);
console.log("map2 => ", map2.get(key));

Après cela ca se complique
je voudrait iterer les deux Map en même temps
je fait ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function compare(map1, map2)  {
map1.forEach((value,key)=>{
 compare(value,map2.get(value));

j'ai un erreur:

TypeError: map1.forEach is not a function

**danielhagnoul** · 22/11/2017, 22h02

Un objet Map n'est pas un objet Array !

Exemple :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
	<!-- cache-control avec max-age=60 pour le développement uniquement -->
  <meta http-equiv="cache-control" content="public, max-age=60">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
  <meta name="author" content="Daniel Hagnoul">
  <title>Test</title>
  <style>
                *,
                *:after,
                *:before {
                        box-sizing: border-box;
                }
                
                /* CSS du test */
                                
                /* Fin CSS du test */
 
  </style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/locale/fr.js"></script>
  <script src="http://danielhagnoul.developpez.com/lib/dvjh/dvjhUtilities-1.4.0.js"></script>
	<script>
    'use strict';
                
                document.addEventListener( "DOMContentLoaded", ev => {
                        // le DOM est construit, la page web n'est pas visible
                        moment.locale( "fr" );
                        klog( `DOM ready   : ${ new kDvjhDate() }` );
                        
      // code du test
 
 
                        // fin code du test
      
    }, false );
    
    window.addEventListener( "load", ev => { 
                        // le DOM est construit et la page web est visible
                        klog( `Window load : ${ new kDvjhDate() }` );
                        
      // code du test
                        
                        function compareMap( mapA, mapB ){
                                const
                                        resultTrue = "Les deux Map sont identiques",
                                        resultFalse = "Les deux Map sont différentes";
                                        
                                let
                                        boolOK = false;
                                
                                klog( "*****" );
                                
                                if ( mapA.size !== mapB.size ){
                                        klog( `Les Map n'ont pas la même taille` );
                                } else {
                                        for ( const [ key, value ] of mapA.entries() ){
                                                if ( ! mapB.has( key ) || value !== mapB.get( key ) ){
                                                        klog( `Les Map n'ont pas la même clé ou la même valeur` );
                                                        boolOK = false;
                                                        break;
                                                } else {
                                                        boolOK = true;
                                                }
                                        }
                                }
                                
                                klog( boolOK ? resultTrue : resultFalse );
                        }
                        
                        { // test 1
                                let
                                        map1 = new Map( [
                                                [ 1, 'one' ],
                                                [ 2, 'two' ],
                                                [ 3, 'three' ],
                                        ] ),
                                        map2 = new Map();
                                
                                map2.set( "key1", "value1" );
                                map2.set( "key2", "value2" );
                                map2.set( "key3", "value3" );
                                map2.set( "key4", "value4" );
                                map2.set( "key6", "value5" );
                                
                                
                                compareMap( map1, map2 );
                        }
                        
                        { // test 2
                                let
                                        map1 = new Map( [
                                                [ 1, 'one' ],
                                                [ 2, 'two' ],
                                                [ 3, 'three' ],
                                        ] ),
                                        map2 = new Map();
                                
                                map2.set( "key1", "value1" );
                                map2.set( "key2", "value2" );
                                map2.set( "key3", "value3" );
                                
                                
                                compareMap( map1, map2 );
                        }
                        
                        { // test 3
                                let
                                        map1 = new Map( [
                                                [ 1, 'one' ],
                                                [ 2, 'two' ],
                                                [ 3, 'three' ],
                                        ] ),
                                        map2 = new Map();
                                
                                map2.set( "1", "one" );
                                map2.set( "2", "two" );
                                map2.set( "3", "three" );
                                
                                
                                compareMap( map1, map2 );
                        }
                        
                        { // test 4
                                let
                                        map1 = new Map( [
                                                [ 1, 'one' ],
                                                [ 2, 'two' ],
                                                [ 3, 'three' ],
                                        ] ),
                                        map2 = new Map();
                                
                                map2.set( 1, "one" );
                                map2.set( 2, "two" );
                                map2.set( 3, "three" );
                                
                                
                                compareMap( map1, map2 );
                        }
 
                        // fin code du test
                        
      kIDUnique();
    }, false );
  </script>
</head>
<body>
	<main>
 
 
	</main>
</body>
</html>

**Watilin** · 23/11/2017, 01h14

J’avais tiqué sur le forEach aussi, mais j’ai vérifié, c’est standard, les maps ont une méthode forEach. Si ça fait une erreur en l’occurence, c’est parce que notre ami sinzen ne teste pas au début de sa fonction s’il a affaire à une map ou à une valeur primitive.

Sinzen, alternativement tu peux utiliser cette belle boucle proposée par Daniel :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

for ( const [ key, value ] of mapA.entries() ){

Je t’avais déjà parlé de Object.entries(), tu te souviens ? Eh bien ça fonctionne pareil. Dans tous les cas, que tu choisisses la solution fonctionnelle (forEach) ou impérative (for..of), tu dois tester le type de tes arguments.

Daniel j’ai une question hors sujet pour toi : tu fais confiance à CloudFlare ? Note, je n’ai pas d’opinion a priori sur ce sujet.

**danielhagnoul** · 23/11/2017, 22h06

Envoyé par Watilin

[...] Daniel j’ai une question hors sujet pour toi : tu fais confiance à CloudFlare ? Note, je n’ai pas d’opinion a priori sur ce sujet.

J'ignorai l'existence de Cloudflare, je n'ai donc aucun avis sur lui.

S'il s'agit de trouver un bon fournisseur VPN, j'utilise Avast avec bonheur depuis que le service existe (2 ans, je crois, et je viens de renouveler mon abandonnement pour 2 ans).

J'utilise Avast Premium et trois services complémentaires : VPN SecureLine, Mots de passe et Avast Cleanup.

Bien entendu on ne peut pas faire n'importe quoi avec le VPN et tout cela n'est pas gratuit. Mais il y a souvent des remises importantes surtout pour les abonnements de longue durée (30 à 50%).

Aperçu des connexions disponibles :

Nom : AvastVPN.PNG
Affichages : 196
Taille : 118,3 Ko

Nom : AvastVPN.PNG
Affichages : 196
Taille : 118,3 Ko

**Watilin** · 23/11/2017, 22h47

Si je te posais la question, c’est parce qu’il y a ça dans ton code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/locale/fr.js"></script>

Et je pensais que c’était toi qui l’avais écrit.

**danielhagnoul** · 24/11/2017, 11h16

Envoyé par Watilin

Si je te posais la question, c’est parce qu’il y a ça dans ton code : [...]

Ho !

J'utilise souvent des liens venant du serveur de code https://cdnjs.com/#. C'est un copier-coller quasi automatique, la plupart du temps je ne fais pas attention au chemin du lien.

**sinzen** · 24/11/2017, 11h36

Merci pour vos réactions.

j'arrive bien a parcourir mes Map et savoir si elles sont identiques.

maintenant je veux retourner une map avec l'intersection de ces deux map..

afin de recuperer les elements se trouvant ou non dans chaqune des Map

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
function testFunction(map1,map2) {
    let mMapIntersec = new Map();
    map1.forEach((value,key)=> {
        if(typeof value === 'object')
        {
            if(map2.has(key) === false)
            {
                if(map2.get(key) !== undefined)
                    mMapIntersec.set(key,testFunction(value,map2.get(key)));
                else
                    mMapIntersec.set(key,testFunction(value,map2));
            }
        }
        else{
            if(map2.has(key))
                mMapIntersec.set(key,value);
        }
    })
    return mMapIntersec;
}

Je recupere bien l'intersection.

Mais peut être que vous pourrez m'aider sur cela:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
if(otherKeys.has(key) === false)
{...}

je voudrait comme comme je l'ai dit, retourner une map avec les elements qui ne sont pas dans une des map.
seulement il ne rentre jamais dans cette condition. Pourtant mes map ne sont pas identique.
Comme je travaille sur plusieurs niveaux idéalement je voudrais récupérer toutes les clés parents..

[ES6] Itération deux structure Map

JavaScript

Vue hybride

Discussions similaires

Partager

Partager