Tableaux et affectation

**babib92** · 07/10/2009, 16h32

Bonjour...

je viens de tomber sur un truc tout con mais qui me casse la tete..

Code :

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

1
2
3
4
5
6
7
8
9
10
 
 
var aSelectTotal 	= new Array(1,2,3,4);
var aSelect 	= new Array(1,2,3);
 
alert(aSelect.length+" / "+aSelectTotal.length);
aSelect = aSelectTotal;
alert(aSelect.length+" / "+aSelectTotal.length);
aSelect.push(5,6);
alert(aSelect.length+" / "+aSelectTotal.length);

ben normalement les alertes devraient etre : 3 /4 puis 4 / 4 puis 6 / 4

ben non c 3 / 4 puis 4 / 4 et 6 / 6

Je ne cromprends vraiment pas !!!!

Merci de votre aide !!

**yann0807** · 07/10/2009, 17h15

As tu essayé d'afficher tes tableaux à chaque modification? Pour voir simplement s'il n'y a pas un problème au niveau des tableaux.

**Bovino** · 07/10/2009, 17h21

Salut,
Lorsque tu fais

Code :

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

aSelect = aSelectTotal;

aSelect pointe vers aSelectTotal, donc toute modification sur l'un est répercutée sur l'autre.

**yann0807** · 07/10/2009, 17h21

Ah bah non c'est normal tu fais:

Code :

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

1
2
 
aSelect = aSelectTotal;

Faut faire:

Code :

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

1
2
 
aSelect == aSelectTotal;

**SpaceFrog** · 07/10/2009, 17h21

l'egalité d'array est une affectation par reference ...
aSelect et aSelectTotal pointent vers un seul et même array

il faut partir d'un nouvel array

Code :

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

1
2
3
4
5
6
7
8
9
var aSelectTotal 	= new Array(1,2,3,4);
var aSelect 	= new Array(1,2,3);
 
alert(aSelect.length+" / "+aSelectTotal.length);
aSelect = new Array();
aSelect=new Array().concat(aSelectTotal);
alert(aSelect.length+" / "+aSelectTotal.length);
aSelect.push(5,6);
alert(aSelect.length+" / "+aSelectTotal.length);

**gwyohm** · 07/10/2009, 17h22

Envoyé par babib92

Code :

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

1
2
3
 
 
aSelect = aSelectTotal;

A ce niveau, tu ne clone pas l'objet, tu fais pointer aSelect sur le même emplacement que aSelectTotal...
Il faut que tu implémentes une fonction clone:

Code :

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

1
2
3
4
5
6
7
8
9
Array.prototype.clone = function() {
  var res = [];
  for(var i=0,size=this.length;i<size;i++) {
    res.push(this[i]);
  }
}
 
// ...
aSelect = aSelectTotal.clone();

**gwyohm** · 07/10/2009, 17h24

La solution de SpaceFrog est très vite 2 fois plus performante et même de mieux en mieux avec la volumétrie...

Code :

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

1
2
3
Array.prototype.clone = function() {
			new Array().concat(this);
		}

**babib92** · 07/10/2009, 17h29

ok merci pour ces réponses...

C'est quand meme déroutant cette affaire...

j'étais jamais tombé sur ce cas... fallait savoir que cela ne copiait pas le tableau mais pontait vers la meme reference.

avec un autre type de variable (ex a = 1; b = 2; a = b; a++

cela ne modifie que a et pas b.

Je retiens donc la leçon et vous remercie

**babib92** · 07/10/2009, 17h37

cela ne marche pas :

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
22
23
24
25
26
27
28
29
30
 
var aSelectTotal 	= [1,2,3,4];
var aSelect 		= [1,2,3];
 
Array.prototype.clone = function() {
	new Array().concat(this);
}
 
 
function afficheTable(iTest) {
	sAlert = "Test "+iTest+") :\n---------------------\n";
	sAlert += "Tableau aSelect ("+aSelect.length+") :\n---------------------\n";
	for( i = 0; i < aSelect.length ; i++) {
		sAlert += i+ " : " + aSelect[i] + "\n";
	}
	sAlert += "Tableau aSelectTotal ("+aSelectTotal.length+") :\n---------------------\n";
	for( i = 0; i < aSelectTotal.length ; i++) {
		sAlert += i+ " : " + aSelectTotal[i] + "\n";
	}
 
	alert(sAlert);
}
 
 
 
afficheTable(1);
aSelect = aSelectTotal.clone();
afficheTable(2);
aSelect.push(5,6);
afficheTable(3);

erreur : afficheTable(2) => aSelect is undifined

**gwyohm** · 07/10/2009, 17h50

Il manque le return

desole

Code :

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

1
2
3
Array.prototype.clone = function() {
	return new Array().concat(this);
}

**babib92** · 07/10/2009, 17h53

Autant pour moi

Code :

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

1
2
3
4
5
 
Array.prototype.clone = function() {
	var a = new Array().concat(this);
	return a;
}

Pour les utilisateur de jquery g trouvé ça aussi (je sais pas si aussi bien car je ne connais pas le procésus de $.extend)... c'est peut etre (sans doute) plus lourd

Code :

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

1
2
 
aSelect  = $.extend(true, [], aSelectTotal);

**Bovino** · 07/10/2009, 19h06

Il me semble avoir lu quelque part que le plus performant serait en fait :

Code :

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

1
2
3
4
var test = [1, 2, 3];
var test2 = test.join('|').split('|');
test2.push(4, 5);
alert(test+"\n"+test2)

A tester...

EDIT :
Bon, ben après avoir testé, je retourne dans mes 22

C'est la solution de gwyohm la plus rapide, puis celle de Spaffy et la mienne est aux choux... (du moins, avec FF 3.5 et un test sur 1000 à 1000000 éléments).
Voir l'exemple de la FAQ.

**babib92** · 07/10/2009, 19h52

Connaissez vous un outil qui permette de tester la performance d'une methode par rapport à une autre ?

**SpaceFrog** · 07/10/2009, 20h28

suffit de se faire son propre benchmark ..
y'en n'a pas dans les contributions ?

Code :

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

avec un autre type de variable (ex a = 1; b = 2; a = b; a++ cela ne modifie que a et pas b.

oui mais cette syntaxe ne te choque pas :

Code :

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

1
2
3
 
var obj=document.getElementById('moninput');
obj.value='huitre transilvanienne';

Javascript semble avoir le comportement d'affectation par référence et non par valeur pour les objets ...

**Bovino** · 07/10/2009, 21h35

+1 Spaffy, je rajouterais quand-même une précision

avec un autre type de variable (ex a = 1; b = 2; a = b; a++ cela ne modifie que a et pas b.

En réalité, l'objet Array est un type particulier d'objet Object (pour s'en persuader, faire un alert du typeof d'une variable tableau puis puis un du constructor).
Or, quand tu utilises un type Object, tu crées une instance de cet objet.
Donc, quand tu fais :

Code :

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

var tableau2 = tableau1;

c'est bien l'instance de cet objet que tu copies, donc effectivement, la référence à l'objet instancié.
A l'inverse, les "objets" String ou Number sont des propriétés de Object (un typeof d'une variable de type chaîne te renvoie "string", pas "String") donc quand tu fais une copie, tu copies la propriété, pas l'instance, les deux variables sont donc déliées (ce qui d'ailleurs ne vaut pas pour le cas particulier this qui continue à hériter de l'original après une copie, c'est donc un Object à part entière).

**babib92** · 07/10/2009, 22h26

@ Bovino : Merci beaucoup pour ces précisions

@ SpaceFrog :

oui mais cette syntaxe ne te choque pas :

Code :

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

1
2
3
 
var obj=document.getElementById('moninput');
obj.value='huitre transilvanienne';

Là je dois avouer que je ne vois pas le rapport. Tu changes un attribut de l'objet... et il n'y a pas de référence. Pour m'expiquer:

Code :

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

1
2
3
4
5
6
 
var sTxt = "huitre transilvanienne";
var obj=document.getElementById('moninput');
obj.value=sTxt;
 
sTxt = "moule normande";

Le valeur de l'input n'est pas modifiée

**SpaceFrog** · 07/10/2009, 22h32

le rapport est simple :
on affecte à obj un objet
tout comme tu le faisais en affectant à ta variable un array

Donc dans un cas ça t'étonne que l'objet initial change de valeur et pas dans le second ?

**Bovino** · 07/10/2009, 22h37

Quand tu fais

Code :

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

var obj=document.getElementById('moninput');

ta variable ogj ne contient pas réellement l'objet auquel elle fait référence.
Pour preuve, si tu fais ensuite

Code :

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

obj = undefined;

ta variable ne contient plus rien pourtant ton input existe toujours.
Mais si tu modifies une propriété de obj (dans l'exemple, c'est value), la variable et l'objet référencé sont impactés et ton input a été modifié.
Il s'agit donc bien d'un cas similaire (pas identique effectivement) à ta question sur les tableaux, donc ce que voulais dire Spaffy, c'est que cette particularité que tu soulevais, en fait tu l'utilises tout le temps