©
. Document créé le 4 février 2009 , mis à jour le 4 février 2009.Si les faits ne correspondent pas à la théorie, changez les faits. Albert Einstein
Accueil du site > Astuces > Javascript > Array.join() v.s. concaténation
Dans la série test d’optimisation javascript, entre array.join() et la concaténation, on peut parfois hésiter. Vraiment ?
En lisant cet article sur Usuable Type, l’idée d’utiliser array.join() au lieu de la concaténation traditionnelle (texte + texte) sous javascript semble séduisante.
Petits tests rapide :
Code de test :
<script type="text/javascript">
<!--
var ii, delai = 10000, text = '';
/*
* petit tableau
*/
var s_array = new Array("Annie","Estelle","Francine","Carole");
var l_array = new Array();
/*
* gros tableau
*/
for (ii = 0; ii < 100; ii++) {
l_array[ii] = "Portez ce vieux whisky au juge blond qui fume sur son île intérieure, à "
+ "côté de l'alcôve ovoïde, où les bûches se consument dans l'âtre, ce "
+ "qui lui permet de penser à la cœnogenèse de l'être dont il est question "
+ "dans la cause ambiguë entendue à Moÿ, dans un capharnaüm qui, "
+ "pense-t-il, diminue çà et là la qualité de son œuvre";
}
/* test #1, concatenation */
var n0 = new Date();
for (ii = 0; ii < delai; ii++) {
text = 'There are ' + s_array.length + ' members in the elements array s_array.';
}
var n1 = new Date();
var res = n1 - n0;
document.write('test #1 (concatenation) end @ ' + res + ' ms : ' + text + '<br/>');
/* test #2, array.join() */
var n0 = new Date();
for (ii = 0; ii < delai; ii++) {
text = ['There are', s_array.length, 'members in the elements array s_array.'].join(' ');
}
var n1 = new Date();
var res = n1 - n0;
document.write('test #2 (array.join()) end @ ' + res + ' ms : ' + text + '<br/>');
/* test #3, concatenation */
var n0 = new Date();
for (ii = 0; ii < delai; ii++) {
text = 'There are ' + l_array.length + ' members in the elements array l_array.';
}
var n1 = new Date();
var res = n1 - n0;
document.write('test #3 (concatenation) end @ ' + res + ' ms : ' + text + '<br/>');
/* test #4, array.join() */
var n0 = new Date();
for (ii = 0; ii < delai; ii++) {
text = ['There are', l_array.length, 'members in the elements array l_array.'].join(' ');
}
var n1 = new Date();
var res = n1 - n0;
document.write('test #4 (array.join()) end @ ' + res + ' ms : ' + text + '<br/>');
/*
* Placer *.length dans une var pour optimiser ?
*/
/* test #5, concatenation */
var len = l_array.length;
var n0 = new Date();
for (ii = 0; ii < delai; ii++) {
text = 'There are ' + len + ' members in the elements array l_array.';
}
var n1 = new Date();
var res = n1 - n0;
document.write('test #5 (concatenation) end @ ' + res + ' ms : ' + text + '<br/>');
/* test #6, array.join() */
var len = l_array.length;
var n0 = new Date();
for (ii = 0; ii < delai; ii++) {
text = ['There are', len, 'members in the elements array l_array.'].join(' ');
}
var n1 = new Date();
var res = n1 - n0;
document.write('test #6 (array.join()) end @ ' + res + ' ms : ' + text + '<br/>');
//-->
</script>
Le script du code de test :
Résultats IE7/Windows :
test #1 (concatenation) end @ 44 ms : There are 4 members in the elements array s_array.
test #2 (array.join()) end @ 96 ms : There are 4 members in the elements array s_array.
test #3 (concatenation) end @ 39 ms : There are 100 members in the elements array l_array.
test #4 (array.join()) end @ 79 ms : There are 100 members in the elements array l_array.
test #5 (concatenation) end @ 29 ms : There are 100 members in the elements array l_array.
test #6 (array.join()) end @ 74 ms : There are 100 members in the elements array l_array.
Résultats FFX3/Windows :
test #1 (concatenation) end @ 11 ms : There are 4 members in the elements array s_array.
test #2 (array.join()) end @ 50 ms : There are 4 members in the elements array s_array.
test #3 (concatenation) end @ 8 ms : There are 100 members in the elements array l_array.
test #4 (array.join()) end @ 38 ms : There are 100 members in the elements array l_array.
test #5 (concatenation) end @ 12 ms : There are 100 members in the elements array l_array.
test #6 (array.join()) end @ 41 ms : There are 100 members in the elements array l_array.
Résultats Opéra9/Windows :
test #1 (concatenation) end @ 13 ms : There are 4 members in the elements array s_array.
test #2 (array.join()) end @ 42 ms : There are 4 members in the elements array s_array.
test #3 (concatenation) end @ 14 ms : There are 100 members in the elements array l_array.
test #4 (array.join()) end @ 55 ms : There are 100 members in the elements array l_array.
test #5 (concatenation) end @ 16 ms : There are 100 members in the elements array l_array.
test #6 (array.join()) end @ 37 ms : There are 100 members in the elements array l_array.
Conclusion : concaténation plus rapide. Ceci dit, à l’époque de la rédaction de l’article, ce n’était peut-être pas le cas ?
Les forums sont fermés.