Javascript foreach loop en objeto de matriz asociativa

¿Por qué mi bucle for-each no itera sobre mi objeto de matriz asociativa de JavaScript?

// defining an array
var array = [];

// assigning values to corresponding keys
array["Main"] = "Main page";
array["Guide"] = "Guide page";
array["Articles"] = "Articles page";
array["Forum"] = "Forum board";

// expected: loop over every item,
// yet it logs only "last" assigned value - "Forum"
for (var i = 0; i < array.length; i++) {
    console.log(array[i]);
}

EDITAR: jQuery each() podría ser útil: https://api.jquery.com/jQuery.each/

La .lengthpropiedad solo rastrea propiedades con índices numéricos (claves). Estás usando cadenas para las teclas.

Puedes hacerlo:

var arr_jq_TabContents = {}; // no need for an array

arr_jq_TabContents["Main"] = jq_TabContents_Main;
arr_jq_TabContents["Guide"] = jq_TabContents_Guide;
arr_jq_TabContents["Articles"] = jq_TabContents_Articles;
arr_jq_TabContents["Forum"] = jq_TabContents_Forum;

for (var key in arr_jq_TabContents) {
    console.log(arr_jq_TabContents[key]);
}

Para estar seguro, es una buena idea en bucles como ese asegurarse de que ninguna de las propiedades sean resultados inesperados de la herencia:

for (var key in arr_jq_TabContents) {
  if (arr_jq_TabContents.hasOwnProperty(key))
    console.log(arr_jq_TabContents[key]);
}

editar : probablemente sea una buena idea tener en cuenta que la Object.keys()función está disponible en los navegadores modernos y en el Nodo, etc. Esa función devuelve las teclas "propias" de un objeto, como una matriz:

Object.keys(arr_jq_TabContents).forEach(function(key, index) {
  console.log(this[key]);
}, arr_jq_TabContents);

La función de devolución de llamada pasada .forEach()se llama con cada clave y el índice de la clave en la matriz devuelta por Object.keys(). También pasó la matriz a través de la cual la función está iterando, pero esa matriz no es realmente útil para nosotros; Necesitamos el objeto original . Se puede acceder a eso directamente por su nombre, pero (en mi opinión) es un poco mejor pasarlo explícitamente, lo que se hace pasando un segundo argumento al .forEach()objeto original, que se vinculará como thisdentro de la devolución de llamada. (Acabo de ver que esto se observó en un comentario a continuación).

Este es un enfoque muy simple. La ventaja es que también puede obtener claves:

for (var key in array) {
    var value = array[key];
    console.log(key, value);
}

Para ES6:

array.forEach(value => {
  console.log(value)
})  

Para ES6: (si desea valor, índice y la matriz en sí)

array.forEach((value, index, self) => {
  console.log(value, index, self)
})  

Ya hay algunos ejemplos sencillos, pero me doy cuenta de cómo redactó su pregunta que probablemente proviene de un fondo PHP y espera que JavaScript funcione de la misma manera, no es así. Un PHP arrayes muy diferente de un JavaScriptArray .

En PHP, una matriz asociativa puede hacer la mayor parte de lo que puede hacer una matriz indexada numéricamente (las array_*funciones funcionan, puedecount() , etc.) Simplemente cree una matriz y comience a asignar índices de cadena en lugar de numéricos.

En JavaScript, todo es un objeto (excepto las primitivas: cadena, numérico, booleano), y las matrices son una implementación determinada que le permite tener índices numéricos. Cualquier cosa empujado a una matriz afectará a su length, y puede ser iterado sobre el uso de métodos Array ( map, forEach, reduce, filter,find , etc.) Sin embargo, como todo es un objeto, que está siempre libre para asignar propiedades simplemente, porque eso es algo que se hace a cualquier objeto La notación de corchetes es simplemente otra forma de acceder a una propiedad, por lo que en su caso:

array['Main'] = 'Main Page';

en realidad es equivalente a:

array.Main = 'Main Page';

Según su descripción, supongo que desea una 'matriz asociativa', pero para JavaScript, este es un caso simple de usar un objeto como un mapa hash. Además, sé que es un ejemplo, pero evite nombres sin sentido que solo describan el tipo de variable (por ejemplo array) y el nombre en función de lo que debe contener (por ejemplo pages). Los objetos simples no tienen muchas buenas formas directas de iterar, por lo que a menudo los convertiremos primero en matrices utilizando Objectmétodos ( Object.keysen este caso, también hay entriesy valuesse agregarán a algunos navegadores en este momento) que podemos recorrer.

// assigning values to corresponding keys
const pages = {
  Main: 'Main page',
  Guide: 'Guide page',
  Articles: 'Articles page',
  Forum: 'Forum board',
};

Object.keys(pages).forEach((page) => console.log(page));

arr_jq_TabContents[key] ve la matriz como una forma de índice 0.

Aquí hay una manera simple de usar una matriz asociativa como un tipo de objeto genérico:

Object.prototype.forEach = function(cb){
   if(this instanceof Array) return this.forEach(cb);
   let self = this;
   Object.getOwnPropertyNames(this).forEach(
      (k)=>{ cb.call(self, self[k], k); }
   );
};

Object({a:1,b:2,c:3}).forEach((value, key)=>{ 
    console.log(`key/value pair: ${key}/${value}`);
});

Si el node.js o el navegador son compatibles Object.entries(), se puede usar como alternativa al uso Object.keys()( https://stackoverflow.com/a/18804596/225291 ).

const h = {
  a: 1,
  b: 2
};

Object.entries(h).forEach(([key, value]) => console.log(value));
// logs 1, 2

en este ejemplo, forEachusa la asignación Destructuring de una matriz.

Esto es (esencialmente) incorrecto en la mayoría de los casos:

var array = [];
array["Main"] = "Main page";

Eso crea una propiedad no elemento en la matriz con el nombre Main . Aunque las matrices son objetos, normalmente no desea crear propiedades que no sean elementos en ellas.

Si desea indexar arraypor esos nombres, normalmente usaría unMap objeto simple o simple, no una matriz.

Con un Map(ES2015 +), al que llamaré mapporque soy creativo:

let map = new Map();
map.set("Main", "Main page");

A continuación, iterar utilizando los iteradores de sus values, keys, o entriesmétodos, por ejemplo:

for (const value of map.values()) {
    // Here, `value` will be `"Main page"`, etc.
}

Usando un objeto simple, que llamaré creativamente obj:

let obj = Object.create(null); // Creates an object with no prototype
obj.Main = "Main page"; // Or: `obj["Main"] = "Main page";`

que había entonces iterar sus contenidos utilizando Object.keys, Object.valueso Object.entries, por ejemplo:

for (const value of Object.values(proches_X)) {
    // Here, `value` will be `"Main page"`, etc.
}

var obj = {
  no: ["no", 32],
  nt: ["no", 32],
  nf: ["no", 32, 90]
};

count = -1; // which must be static value
for (i in obj) {
  count++;
  if (obj.hasOwnProperty(i)) {
    console.log(obj[i][count])
  };
};

en este código, utilicé el método de paréntesis para los valores de llamada en la matriz porque contenía la matriz, sin embargo, brevemente, la idea de que una variable i tiene una clave de propiedad y con un bucle llamado ambos valores de la matriz asociada

Método perfecto, si está interesado, presione como

Puedes hacerlo

var array = [];

// assigning values to corresponding keys
array[0] = "Main page";
array[1] = "Guide page";
array[2] = "Articles page";
array[3] = "Forum board";


array.forEach(value => {
    console.log(value)
})