0

I am currently writing a program that returns an response from a API using fetch.

As of now, I have the fetch call working. I then splice the array and use some regex to turn the single string response into a array of numbers ( while also replacing the /n with a , to format the data, because it was in raw CSV form ).

Here is the code for that...

let proxy = "https://cors-anywhere.herokuapp.com/"
    let url =  proxy + "https://secure.runescape.com/m=hiscore_oldschool/index_lite.ws?player=Hess"

function getPlayer() {
  return fetch(url)
    .then((response) => response.text())
    .then((data) => {
      console.log(data)
      return data;
    });
}
getPlayer().then((playerData) => {
  console.log(playerData);
  // This next line removed the indentation and then splits the response into an array of multiple numbers and pushes that array to the array playerStats.
  playerStats.push(playerData.replace(/\n/ig, ',').split(','));
  console.log(playerStats);
});

My issue is that this response returns 183 numbers, each representing one of the players stats.

I want to save each of these numbers as a variable, but doing let attackLevel = playerStats[0] would be very tedious and will leave me with 183 variables.

My question is, what is the best way of going about saving each number as a variable?

My current thinking is that I have the array let playerStats = ["100", "242", "50"] and somehow create variables by parallel linking to an array let statNames = ["attack", "defense", "age" ]. My thinking is that doing something like this would allow me to just create a 2 arrays and let the js generate the variables.

I am not sure if this is a valid solution nor how to go about something like this.

Another option I see is creating an array of objects using both arrays. This way, instead of having 183 variables, I could just create key:pairs using the 2 arrays. I am thinking it would look something like this....

'let stats = [ attack: 100, defense: 242, etc ]`

going with this second solution would serve me better because I am using svelte and It would be a lot easier to work with an array of objects.

I am not sure what the best course of action is or how to go about creating these object key pairs using these 2 arrays.

ETHan
  • 187
  • 1
  • 4
  • 17
  • 1
    Do you seriously have 183 unlabeled numbers in an array representing a different kind of value each‽ Let me be the first to say: OMG! You really want an object to store that data, e.g.: `{"attack": 42, ...}`. And then just use it exactly like that. If you can change the API, you should. – deceze Jul 16 '20 at 19:00
  • The syntax for dynamically adding properties to objects seems relevant here: https://stackoverflow.com/q/1184123/11047824 – zcoop98 Jul 16 '20 at 19:02
  • 1
    "*I then … use some regex to turn the single string response into a array … because it was in raw CSV form*" - Stop right there. Think again. Then use a proper CSV parsing library instead. – Bergi Jul 16 '20 at 19:37

1 Answers1

0

If you have two arrays like you describe, and you want to end up with them combined into an array containing objects made from the "parallel" properties, then use bracket notation with your object(s) to declare property names dynamically:

const stats = [1, 2, 3];
const names = ['a', 'b', 'c'];

//As an array of objects
var combinedArr = [];
for (var i = 0; i < stats.length; i++) {
  combinedArr.push({ [names[i]]: stats[i] });
}

//As a single object
var combinedObj = {};
for (var i = 0; i < stats.length; i++) {
  combinedObj[names[i]] = stats[i];
}

console.log(combinedArr);
// Output: [{ a:1 }, { b:2 }, { c:3 }]

console.log(combinedObj);
// Output: { a:1, b:2, c:3 }

You will still need to have the names at runtime though.
If you have any control over how you receive that data from the API, you may want to look into making it a little more friendly to your usage!

zcoop98
  • 2,590
  • 1
  • 18
  • 31