CODEWITHSUNDEEP
javascriptjquery
88willr
88willr

Reputation: 148

assign name to array of arrays

$(function() {
    $.get("https://spreadsheets.google.com/feeds/list/1VC633BXpMElJjRWvIRuZIP7UrEhuw6BdscnrV2heox0/1/public/full?alt=json", function(data) {
    var entry = data.feed.entry;
    var getKeys = Object.keys(entry[0]).slice(6);
    arr = getKeys.map(title => {
      return entry.map((el) => {
        return el[title].$t;
      }).filter((el) => {
        return el.trim();
      });
    });
    console.log(getKeys);
    console.log(arr);
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Code above will return data from google sheet into array of arrays. I've been stuck on assigning the value from getKeys to each arr group to return a new arr value:

var arr = [
  gsx$fruits = ["apple", "banana"], 
  gsx$animals = ["monkey", "dog", "cat", "bear"], 
  gsx$numbers = ["one", "two", "three", "four"]
]

...this way I can be able to access a specific group not just by index position. Thanks for your help!

Upvotes: 0

Views: 1600

Answers (2)

3limin4t0r
3limin4t0r

Reputation: 21110

I've made a bit of an overhaul, but here is another option:

$(async function() {
  const data = await $.get("https://spreadsheets.google.com/feeds/list/1VC633BXpMElJjRWvIRuZIP7UrEhuw6BdscnrV2heox0/1/public/full?alt=json");
  
  const arrays = {};
  for (const entry of data.feed.entry) {
    for (const key in entry) {
      if (key.slice(0, 4) != "gsx$") continue;
      if (!entry[key].$t.trim()) continue;

      const name = key.slice(4); // optional, you could also use `key`
      if (!arrays[name]) arrays[name] = [];
      arrays[name].push(entry[key].$t);
    }
  }
  
  console.log(arrays);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

This solution first creates an object arrays which will hold the different arrays. I then loop through both the data.feed.entry values and for each entry I will loop through the keys. If the key does not start with "gsx$" or if the associated value is an empty string after trimming I will skip to the next iteration.

If we have not skipped, remove the first 4 characters from key and assign this new value to name (optional). Then check if arrays contains the property name, if not assign the arrays[name] to an empty array.

Lastly push the value into the array.

I tried to make this answer understandable, if you have any question don't be afraid to comment.

Upvotes: 1

Wei Su
Wei Su

Reputation: 656

First thing you need to know is arrays in javaScript are just a specialized form of object, and indexes are integer type property names, so if you want access an element from an array not just by indexes but also property names, you can just use computed properties to map these values to different names.

const keys = ['fruits', 'animals', 'numbers']
const data = [
  ["apple", "banana"],
  ["monkey", "dog", "cat", "bear"],
  ["one", "two", "three", "four"]
];

data.forEach((item, index, array) => array[keys[index]] = item);

console.log(data);
console.log(data[0]);
console.log(data['fruits']);

Though it can solve your problem, it mutates the original array. If you need to access elements with property names, I recommend you use another array method reduce, in this way you can get a new form of data, and keep the original array untouched.

const keys = ['fruits', 'animals', 'numbers']
const data = [
  ["apple", "banana"],
  ["monkey", "dog", "cat", "bear"],
  ["one", "two", "three", "four"]
];


const newFormData = data.reduce((acc, cur, index) => {
  return { ...acc,
    [keys[index]]: cur
  }
}, {});

console.log(data);
console.log(newFormData);

Upvotes: 1

Related Questions