Tableau Javascript montrant un comportement incohérent

Question

Je suis confus concernant les tableaux javascript et la façon dont les index fonctionnent dans ces tableaux. La longueur du tableau est toujours 0, quel que soit le nombre d'éléments de valeur clé présents dans le tableau. Nous pouvons également voir que le tableau n'a que deux éléments à condition que la clé soit une chaîne. Considérons le scénario 1, j'ai le code suivant.

arr = []; 
 
arr['home'] = 1234; 
 
arr['cat'] = 12345; 
 
console.log(arr.length); 
 
console.log(arr);

considèrent maintenant le deuxième scénario, j'ai un tableau vide et j'attribuer un certain nombre au 20 index du tableau. Puis quand je produis le tableau, la longueur montre 21 avec tous les autres emplacements étant 'indéfini'.

arr = []; 
 
arr[20] = 20; 
 
console.log(arr.length); // Length shows 20 Size of array increased to 21

maintenant dans le troisième scénario i assignera les deux indices numérotés et indices de chaîne et montre un autre comportement étrange. La longueur du tableau ne compte pas la valeur avec l'index basé sur une chaîne. Même si j'ai 4 index numériques et un index basé sur une chaîne. Ainsi, la longueur doit être 6 mais la longueur montre 5.

arr = []; 
 
arr[4] = 4; 
 
arr['home'] = 'home'; 
 
console.log(arr);

Maintenant, j'ai deux questions.Firstly, Pourquoi la fonction de longueur non indexé de l'examen du point chaîne? Deuxièmement, pourquoi dans le cas des indices numérotés, la taille du tableau est-elle augmentée pour au moins ce nombre?

Answer 1

Vous devez comprendre que les tableaux JavaScript sont des objets, avec un comportement supplémentaire. Tout comme les objets, vous pouvez leur attribuer des propriétés.

Si le nom de la propriété est une chaîne numérique et qu'il n'y a pas de clé numérique supérieure, la propriété length est mise à jour. Les clés non numériques n'affectent pas la propriété length.

Les méthodes de Array.prototype (filter, slice, ...) fonctionnent uniquement avec les touches numériques du tableau.

Answer 2

Javascript n'a pas de tableaux associatifs comme vous le voyez en PHP. Il a des tableaux, qui ont un index numérique associé à la valeur, puis il a des objets qui sont mappés key => value.

Javascript Arrays et Javascript Objects

const arr = [1, 2, 3, 4, 5, 6, 7]; 

console.log(arr.length); // outputs 7 

const obj = {} 

console.log(obj.length); // undefined 

// set the key => value for obj from arr 

arr.forEach(a => obj[a] = a); 

console.log(obj[0]); // undefined 
console.log(obj[1]); // 1 

console.log(arr[0]); // 1 
console.log(arr[1]); // 2 

JS Bin

Dans l'exemple ci-dessus, vous pouvez voir que arr est un tableau et ses valeurs sont mises en correspondance index => valeur, alors que obj est un objet et ses valeurs sont mappés clé => valeur. Les objets peuvent fonctionner comme des tables de hachage/tableaux associatifs, mais les tableaux ne peuvent pas.

Si vous deviez vouloir obtenir le nombre de valeurs dans une carte objet/hachage, vous pouvez toujours faire ...

Object.keys (obj) .length

En effet, Object.keys(...) retours les clés d'un objet en tant que tableau.

Pour une réponse précise, je devrais préciser que les tableaux sont des objets, cependant, ils fonctionnent différemment d'un objet. Selon les docs, les tableaux sont des "objets de haut niveau ressemblant à une liste"