loop over more then one different arrays with different array name

Question

how can I do that? In PHP I have the $$name form for doing that but in js I don't know how to solve this.

...
// rest of the code
var books = [
 {'h':'book 1','i':[ {'s':'1','w':'some text'}, {'s':'2','w':'other text'} ] }
];
var infos = [
 {'h':'HERE','i':[ {'h':'something','i':[ {'v':[{'g':1,'b':0}],'h':'text X','a':['bla','bla', 'bla']}]} ] }
];

var arrNames = ['books','infos'];

let z = document.getElementById('output');
for( i=0;i<arrNames.length;i++ ){
  arr = localStorage.getItem(arrNames[i]).split(','); // doesnt work :(
  html += arr[0]['h']+'<br>';
}
z.innerHTML = html;

output should to be:

book 1
HERE

but how?

Solution Update:

thx @ Heretic Monkey and his link

arr = window[arrNames[i]][j]['h'];

Does this answer your question? [Is there a way to access a javascript variable using a string that contains the name of the variable?](https://stackoverflow.com/questions/1441532/is-there-a-way-to-access-a-javascript-variable-using-a-string-that-contains-the) — Heretic Monkey, Jun 28 '22 at 15:37
Welcome to Stack Overflow. Your comment, "doesnt work," do you mean that `.getItem()` or `.split()` does not work? If `.getItem()` returns `null`, `.split()` will not work. — Twisty, Jun 28 '22 at 15:39
I'm not sure why this was tagged with `jQuery`? I removed it — Rory McCrossan, Jun 28 '22 at 15:54
why not just an old for loop? `for(let i = 0; i < .length; i++) { console.log(books[i], infos[i]) }` — eroironico, Jun 28 '22 at 16:00
@HereticMonkey thx...thats it! can you set that as solution to get your point? ;) — trash2, Jun 28 '22 at 16:16

Twisty · Accepted Answer · 2022-06-28T16:26:35.510

The issue is that localStorage variables can only store Strings. So when you get that value, and split it, you have now broken it up into an Array of Strings. Here is an example to clarify.

var local = {};
local.books = JSON.stringify([{
  'h': 'book 1',
  'i': [{
    's': '1',
    'w': 'some text'
  }, {
    's': '2',
    'w': 'other text'
  }]
}]);
local.infos = JSON.stringify([{
  'h': 'HERE',
  'i': [{
    'h': 'something',
    'i': [{
      'v': [{
        'g': 1,
        'b': 0
      }],
      'h': 'text X',
      'a': ['bla', 'bla', 'bla']
    }]
  }]
}]);

var arrNames = ['books', 'infos'];

var z = document.getElementById('output');
var html = ""
arrNames.forEach(function(elem) {
  var arr = local[elem].split(",");
  console.log(arr);
  html += arr[0]['h'] + '<br>';
});
z.innerHTML = html;

<div id="output"></div>

You can see that .split() is doing what is needed, and you see the following in console:

[
  "[{\"h\":\"book 1\"",
  "\"i\":[{\"s\":\"1\"",
  "\"w\":\"some text\"}",
  "{\"s\":\"2\"",
  "\"w\":\"other text\"}]}]"
]

I suspect you need to Parse the String back into Variables. Consider the following.

var local = {};
local.books = JSON.stringify([{
  'h': 'book 1',
  'i': [{
    's': '1',
    'w': 'some text'
  }, {
    's': '2',
    'w': 'other text'
  }]
}]);
local.infos = JSON.stringify([{
  'h': 'HERE',
  'i': [{
    'h': 'something',
    'i': [{
      'v': [{
        'g': 1,
        'b': 0
      }],
      'h': 'text X',
      'a': ['bla', 'bla', 'bla']
    }]
  }]
}]);

var arrNames = ['books', 'infos'];

var z = document.getElementById('output');
var html = ""
arrNames.forEach(function(elem) {
  var temp = JSON.parse(local[elem]);
  console.log(temp);
  html += temp[0]['h'] + '<br>';
});
z.innerHTML = html;

<div id="output"></div>

For your code, you might consider taking it further and making helper functions.

function setLocal(index, value) {
  localStorage.setItem(index, JSON.stringify(value));
  return JSON.stringify(value);
}

function getLocal(index) {
  return JSON.parse(localStorage.getItem(index));
}

var arrNames = ['books', 'infos'];

var z = document.getElementById('output');
var html = ""
arrNames.forEach(function(elem) {
  var obj = getLocal(elem);
  console.log(obj);
  html += obj[0]['h'] + '<br>';
});
z.innerHTML = html;

<div id="output"></div>

See More:

interesting ways for that problem....thx – trash2 Jun 29 '22 at 10:27 — trash2, Jun 29 '22 at 10:27

score -1 · Answer 2 · answered Jun 28 '22 at 15:46

-1

You can use lodash zip function

_.zip(['a', 'b'], [1, 2], [true, false]);

In your case it should look like

_.zip(books, infos );

here is documentation page

answered Jun 28 '22 at 15:46

Kostyuk Rostyslav

367
2
16

1

sry no. thats a solution for a future problem :) thx too! – trash2 Jun 28 '22 at 16:17

loop over more then one different arrays with different array name

Solution Update:

2 Answers2