CODEWITHSUNDEEP
javascriptarraysloopsobject
user6052202
user6052202

Reputation:

Selecting arrays with specific element values

This is driving me nuts, I've been trying to figure out how to do this one thing for hours now.

What I want to do is select all array items that have a specific value. This is easiest to explain by example:

I have an array, called media[]. It holds ALL of the media in my media gallery. It has two properties of note: path and gallery, or media[x][0] and media[x][1].

I want to select all media objects that belong in a certain gallery, and then add them to that gallery. That's where I'm struggling and it's driving me mad.

Here are my fumbled attempts at trying to do this... this is some seriously messy code (and mostly pointless), I'm just providing it so you can get a sense of how clueless I am about this. Please note that NONE of the code I have right now actually tries to do anything; everything I've done so far ends up as a broken for or while loop that either does nothing or crashes Chrome.

// this function is meant to return an array of all media items
// that belong in a certain gallery... didn't get that far because
// the loops tripped me up
function getTheMedia (galNum) {
    var output = [];
    for (var i = 0; i < media.length; ++i) {
        // I tried using an if statement here to check if the
        // media[i][1] == galNum, and if so, add it to the output
        // but that didn't work
        output.push(media[i]);
    }
    return output;
}

// this function was actually my first attempt but I kept running into
// the same issue as above
function fillGal () {
    /*
    var output = [];
    for (var i = 0; i < Gallery.length; ++i) {
        output.push(Gallery[i]);
    }
    */
    var output = [];
    var i = 0;
    while (i < media.length) {
        output.push(i);
        i++;
    }
    console.log(output);
}

Seeing as I'm kind of burnt out and frustrating with running in circles (...loops? aha...), all I'm really looking for is a way to select only those specific array items as specified above. Everything else (adding them to the Gallery, etc) I can figure out myself.

Otherwise I'm just going to have to go back to the old way: define separate media[]arrays for each "gallery" (mediaThisGallery, mediaThatGallery, etc), and then combine them all at the end to get "allMedia". Only reason I don't want to do that is because I want to be able to change which gallery a media item belongs to... this HAS to be possible, right?

Thanks in advance! Sorry for the scatter-brainedness. I also apologize if the title is a bit off.

EDIT:

var media = [];

media[0] = ['0.png', 0, 'index'];
media[1] = ['0.png', 0];

media[2] = ['new/316.png', 1, "316"];
media[3] = ['new/kitties.jpg', 1, "D'aww kitties!!"];
media[4] = ['new/home.jpg', 1, "\"I'm Going Home\""];
media[5] = ['new/3.mp4', 1, "Crucible Carnage"];
media[6] = ['new/942.jpg', 1, "this is straight for testing purposes like omg long ass title lol"];
media[7] = ['new/boom.mp4', 1, "Maximum Efficiency"];
media[8] = ['new/42.jpg', 1, "Moo"];

// this is only included as a quick fix so my working code doesn't break
// as my "production" code is using multiple arrays; Media is used
// to store only the selected array (current Gallery)
// in other words, ignore this
var Media = [];
Media = media;

var Gallery = [];
Gallery[0] = [mediaRoot, "index", media ];
Gallery[1] = [mediaRoot, "new", Media ];

It's pretty arbitrary atm.

Note that the main reason I'm converting from multiple arrays to a single array is that eventually, I plan to expand this app and I thought it made more sense to store ALL media in a single "database".

Upvotes: 1

Views: 4679

Answers (5)

Oleksandr Tyshchenko
Oleksandr Tyshchenko

Reputation: 471

Try this implementation of your getTheMedia function

function getTheMedia (galNum) {
    return media.filter(function(item){return item && item[1] === galNum;});
}

You may test it like this:

console.log('gal 0');
console.log(getTheMedia(0));
console.log('gal 1');
console.log(getTheMedia(1));

Upvotes: 0

Techek
Techek

Reputation: 475

Why not define your galleries and gallery-entries in JS-notation like:

var galleries = [
  {
    id: 1,
    name: "new",
    medias: [
      {
        img: "new/316.png",
        name: 316
      },
      {
        img: "new/home.png",
        name: "Going Home"
      }
    ]
  },
  {
    id: 2,
    name: "index",
    medias: []
  }
]

That way you would be able to visualize the data-structure which in turn would make it easier for you to traverse, add and remove elements.

Upvotes: 0

cнŝdk
cнŝdk

Reputation: 32175

Well you can simply use .filter() method like this:

var output = media.filter(function(m) {
  return m[1] == galNum;
});

Upvotes: 2

Douglas Neves
Douglas Neves

Reputation: 1

Javascript arrays have a filter function, like so:

console.log([0,1,2,3,4,5,6,7,8,9,10].filter(v=>v!==0))

The above example remove all the '0' from the array. I think it can be helpful in your case.

More information in: https://www.w3schools.com/jsref/jsref_filter.asp

Upvotes: 0

Jonas Wilms
Jonas Wilms

Reputation: 138567

May set up a gallery map:

const galleries = new Map();

Then fill in your media:

media.forEach( ([path, gallery]) => {
  if( galleries.has(gallery) ){
    galleries.get(gallery).push(path);
  } else {
    galleries.set(gallery, [path]);
  }
});

So now you can get the paths in a gallery like this:

console.log(galleries.get("somegallery"));

Upvotes: 0

Related Questions