javascript multidimensional array

Asked

Viewed 6,230 times

1

I have the following question. I will simplify as much as I can for you to understand. I am developing a game and have an array of values. This array is multidimensional:

var valores = [["jaguatirica", "onça-pintada", "suçuarana"],["sabia","canario"],["pacu", "lambari"]]

And I have another multidimensional array with image paths:

var img = [["jaguatirica.jpg", "onça-pintada.jpg", "suçuarana.jpg"],["sabia.jpg","canario.jpg"],["pacu.jpg", "lambari.jpg"]]

I want to turn these two arrays into one:

var resultado = [valores[0][0], img[0][0]]

which will result: ocelot, ocelot.png.

But I want all the values to come together with their respective images. Please help me, it is an educational game and will be used in municipal schools. link of the game under development

javascript array web-application
  • 1

    Is using pure javascript (according to the tag used) or has a jQuery running as well?

  • Only javascript is pure anyway

  • 1

    Right. Put the right answer here on @Theprohands, because he answered what you would say: make a for traverse an array and join with each other.

2 answers

2


To join all values and their respective images you will have to go through each element of each array and pull to the array resultado.

var resultado = [];

for(var i = 0, ln = valores.length; i < ln; i ++) {
    for(var b = 0, len = valores[i].length; b < len; b ++) {
        resultado.push([
            valores[i][b],
            img[i][b]
        ]);
    }
}

  • I cannot return any value on the console.log. NOTE, I only changed the variables var resultado = [];&#xA; for (var i = 0; i < categories.length; i++) {&#xA; for (var b = 0; i < categories[i].length; b++) {&#xA; resultado.push([&#xA; categories[i][b],img[i][b]&#xA; ]);&#xA; }&#xA; }&#xA;console.log(resultado)&#xA;

  • @For me, when I called console.log then, at least on some websites, it printed the object differently, but it worked on Jsfiddle. I don’t understand, but it doesn’t affect the object. It works.

  • @Luiscarlosdesouzamuniz Either way it will result in the same memorizing or not the size of an array in a loop and it is better to memorize the size, so the array will not be re-calculated while the loop runs, and so the performance of the game will be better. However, they seem to have said that modern browsers already store the size of an array in themselves in the property length.

  • Thanks for the help and example. I will use it for more codes here.

0

In modern browsers and assuming that both arrays are aligned in both content and structure, the method can be used Array.prototype.flat(), creating a new array by concatenating all elements of the sub-array, to standardize the data and facilitate the preparation of the result:

let val = [
  ["jaguatirica", "onça-pintada", "suçuarana"],
  ["sabia", "canario"],
  ["pacu", "lambari"]
];
let img = [
  ["jaguatirica.jpg", "onça-pintada.jpg", "suçuarana.jpg"],
  ["sabia.jpg", "canario.jpg"],
  ["pacu.jpg", "lambari.jpg"]
];

let result = [];                           //Cria o array que receberá o resultado da operação.
let val2 = val.flat();                     //Cria uma array unidimensional a partir dos elementos de val.
let img2 = img.flat();                     //Cria uma array unidimensional a partir dos elementos de img.

//Itera pelos índices de um dos arrays presumindo que val2 e img2 estejam alinhados em tamanho e conteúdo...
for (var i = 0; i < val2.length; i++) {
  result.push([val2[i], img2[i]]);         //... adiciona ao resultado um array com os elementos correspondentes em val2 e img2.
}

console.log(result);                       //Imprime o resultado.

In older browsers or OEM browsers Array.prototype.flat() is not available so use a polyfill.

let val = [
  ["jaguatirica", "onça-pintada", "suçuarana"],
  ["sabia", "canario"],
  ["pacu", "lambari"]
];
let img = [
  ["jaguatirica.jpg", "onça-pintada.jpg", "suçuarana.jpg"],
  ["sabia.jpg", "canario.jpg"],
  ["pacu.jpg", "lambari.jpg"]
];

let result = [];                           
let val2 = val.reduce((acc, val) => acc.concat(val), []); 
let img2 = img.reduce((acc, val) => acc.concat(val), []);                     
for (var i = 0; i < val2.length; i++) {
  result.push([val2[i], img2[i]]);         
}

console.log(result);

Browser other questions tagged javascript array web-application

You are not signed in. Login or sign up in order to post.