Boucle for orientée objet

**stracoma** · 08/10/2016, 21h36

Bonsoir tout le monde.
Je suis débutant en javascript et j'ai besoin de votre aide pour comprendre pourquoi un code ne marche pas.
Ce premier code marche:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
var p="";
var identite={
	nom:"Bidou",
	prenom:"Nanou",
	age:23
};
for(var elem in identite){
	p+=identite[elem] +"\n";
}
alert(p);

J'ai comme résultat:
Bidou
Nanou
23
Avec le code suivant, j'attends au même résultat, mais non, je n'ai rien comme comme affichage:

Code :

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

1
2
3
4
5
6
7
 
var identite={
	nom:"Bidou",
	prenom:"Nanou",
	age:23
};
alert(identite[nom] +"\n"+identite[prenom] +"\n"+identite[age] +"\n");

Pourquoi?
Merci

**mathieu** · 08/10/2016, 23h51

avez-vous vu l'erreur dans la console de développement ?

**Beginner.** · 09/10/2016, 01h10

Salut,

J'ai suivi le conseil de Mathieu car cela m’intéressait de savoir pourquoi ça marche pas...

Il nous dit : Uncaught ReferenceError: nom is not defined...

Et voilà ce que je comprends : quand on écrit : identite[nom] alors "nom" est considérée comme une variable or celle-ci n'est définie nulle part (cette variable est "undefined") ! Si on met juste avant : var nom = "nom"; cela marche mais pour accéder à la propriété "nom" de l'objet "identite" on peut directement écrire identite["nom"] et ça marche mais là on nous dit qu'il est préférable d'utiliser la notation avec le point : identite.nom...

**eleydet** · 09/10/2016, 10h00

Puisque vous demandez votre "langue au chat":

Code :

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

1
2
3
4
5
6
var identite={
	nom:"Bidou",
	prenom:"Nanou",
	age:23
};
alert(identite['nom'] +"\n"+identite['prenom'] +"\n"+identite['age'] +"\n");

**Toufik83** · 09/10/2016, 12h06

ou bien tout simplement

Code :

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

1
2
3
4
5
6
7
 
var identite={
	nom:"Bidou",
	prenom:"Nanou",
	age:23
};
alert(identite.nom +"\n"+identite.prenom +"\n"+identite.age +"\n");

**danielhagnoul** · 09/10/2016, 12h14

Envoyé par Beginner.

[...] Et voilà ce que je comprends : quand on écrit : identite[nom] alors "nom" est considérée comme une variable or celle-ci n'est définie nulle part (cette variable est "undefined") ! Si on met juste avant : var nom = "nom"; cela marche mais pour accéder à la propriété "nom" de l'objet "identite" on peut directement écrire identite["nom"] et ça marche mais là on nous dit qu'il est préférable d'utiliser la notation avec le point : identite.nom...

C'est toujours du texte. C'est seulement lorsque la clé est formée d'un seul mot que l'on peut omettre les guillemets et utiliser la notation "objet.clef"

Exemple :

Code JavaScript :

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

1
2
3
4
5
6
7
8
let identite = {
	"nom de l'écrivain" : "Bidou",
	"prénom de l'éditeur" : "Nanou",
	"âge du concierge" : 23
};
 
// debug, console, touche F12
console.log( identite[ "nom de l'écrivain" ], identite[ "prénom de l'éditeur" ], identite[ "âge du concierge" ] );

C'est par facilité que l'on utilise le francais sans accents ou l'anglais et que l'on regroupe les mots composés en utilisant le "camelCase".

Exemple :

Code JavaScript :

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

1
2
3
4
5
6
7
let identite = {
	nomEcrivain : "Bidou",
	prenomEditeur : "Nanou",
	ageConcierge : 23
};
 
console.log( identite.nomEcrivain, identite.prenomEditeur, identite.ageConcierge );

**Beginner.** · 09/10/2016, 15h14

Envoyé par danielhagnoul

C'est toujours du texte. C'est seulement lorsque la clé est formée d'un seul mot que l'on peut omettre les guillemets et utiliser la notation "objet.clef"

Merci et +1 !

Si j'ai bien compris, j'en déduis que si on veut que la clé soit formée de plus d'un mot il faut utilisé les guillemets, c'est bien ça ?

**NoSmoking** · 09/10/2016, 18h40

Bonjour,

...on veut que la clé soit formée de plus d'un mot il faut utilisé les guillemets, c'est bien ça ?

oui mais à mon sens cette technique est une mauvaise approche et comme l'a dit danielhagnoul utilise le « camelCase ».

La notation objet["propriete"] est néanmoins préférable si malheureusement on utilise une propriété faisant partie des mots réservés, même si les navigateurs modernes arrivent à faire la différence.

**Beginner.** · 09/10/2016, 19h42

Envoyé par NoSmoking

Bonjour,
oui mais à mon sens cette technique est une mauvaise approche et comme l'a dit danielhagnoul utilise le « camelCase ».

La notation objet["propriete"] est néanmoins préférable si malheureusement on utilise une propriété faisant partie des mots réservés, même si les navigateurs modernes arrivent à faire la différence.

Merci et +1 ! Oui moi aussi ça me dit rien d'utiliser plusieurs mots et des guillemets, je ne trouve pas que ce soit plus lisible et c'est plus lourd...

Mais je voulais parlé de la clé (si c'est bien comme ça que ça s'appelle), le nom de la propriété dans l'objet, exemple :

Y a-t-il une différence entre ça : var obj = { nom: "Jean"} et ça var obj = { "nom": "Jean"} ?

Oui parce qu'il me semble avoir déjà vu des guillemets dans les "clés" mais peut-être que je confond avec autre chose (du JSON peut-être ?)...

**melka one** · 09/10/2016, 22h43

jour

le premier est un objet javascript et le second un objet json dans la manipulation il y a une différence mais je me rappel plus laquel

**stracoma** · 09/10/2016, 23h14

Bonsoir
Merci pour vos réponses.
Ce qui m'intéresse c'est de savoir pourquoi le deuxième code ne marche pas, et non pas arriver au résultat.
Donc je suis intéressé par le code donné par eleydet:

Code :

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

1
2
3
4
5
6
7
 
var identite={
	nom:"Bidou",
	prenom:"Nanou",
	age:23
};
alert(identite['nom'] +"\n"+identite['prenom'] +"\n"+identite['age'] +"\n");

Effectivement ce code marche, mais je me demande toujours la chose suivante:
Dans mon 1er code qui marche, càd la boucle for, elem représente successivement, nom, prenom et age et non pas 'nom', 'prenom' et 'age', et d'autre part dans la boucle for j'ai utilisé identite[elem] et non identite['elem']
merci à vous

**Beginner.** · 10/10/2016, 00h55

@melka one : Merci et +1, à suivre...

Envoyé par stracoma

Effectivement ce code marche, mais je me demande toujours la chose suivante:
Dans mon 1er code qui marche, càd la boucle for, elem représente successivement, nom, prenom et age et non pas 'nom', 'prenom' et 'age', et d'autre part dans la boucle for j'ai utilisé identite[elem] et non identite['elem']
merci à vous

C'est ce que j'expliquais (ou essayais d'expliquer) dans mon message #3.

L’erreur est je pense dans ta phrase en gras justement, car "elem" est une variable de type string qui contient successivement les strings : 'nom', 'prenom' et 'age'...

Regarde ce code :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
var p="";
var identite={
  nom:"Bidou",
  prenom:"Nanou",
  age:23
};
for(var elem in identite){
  p+=identite[elem] +"\n";
  console.log("type de elem : |" + typeof(elem) + "| valeur de elem : |"+elem + "|");
 
}

On obtient ceci dans la console :

Tu peux tester ici : http://jsbin.com/gozehucaxi/edit?js,console

Et comme je disais :

Et voilà ce que je comprends : quand on écrit : identite[nom] alors "nom" est considérée comme une variable or celle-ci n'est définie nulle part (cette variable est "undefined") ! Si on met juste avant : var nom = "nom"; cela marche mais pour accéder à la propriété "nom" de l'objet "identite" on peut directement écrire identite["nom"] et ça marche mais là on nous dit qu'il est préférable d'utiliser la notation avec le point : identite.nom...

Ainsi si on met ceci : var nom = "nom" avant l'instruction identite[nom] cela fonctionne car du coup la variable nom est définie et contient la string "nom"... Et dans ta boucle c'est ce qui se passe, c'est comme si on avait :

- premier tour 1 : elem = "nom"; p+=identite[elem] +"\n";.
- second tour : elem = "prenom"; p+=identite[elem] +"\n";.
- et enfin troisième tour : elem = "age"; p+=identite[elem] +"\n";

Envoyé par stracoma

... et d'autre part dans la boucle for j'ai utilisé identite[elem] et non identite['elem']

Si on écrit : identite[elem]; on a la variable elem entre les crochets... alors que dans l'instruction identite["elem"]; on a la constante "elem" entre les crochets...

En espérant que ce soit plus clair cette fois-ci...