Tips for sorting through an array containing various types of data

Question

Tips for sorting through an array containing various types of data

I'm dealing with an array structured like this:

const AllFiles = [

    {name: "ExistingFile1", mimetype: "image/jpg", size: "500"},

    [ 
     File, // This is the New File itself (see File API)
     {name: "NewFile1", mimetype: "video/mp4", size: "9000"}
    ],

    {name: "ExistingFile2", mimetype: "video/mp4", size: "4000"},

    [ 
     File, // This is the New File itself (see File API)
     {name: "NewFile2", mimetype: "image/jpg", size: "500"}
    ],

 ]

The AllFiles array includes a mix of objects and arrays.

I am trying to filter the AllFiles array to only retrieve items where the mimetype begins with "image/".

This is what I started with:

const FilteredFiles = AllFiles.filter((FileItem, index) => FileItem.mimetype.startsWith("image/"))

The issue is that it only checks for the mimetype in top level objects. It does not check deeper where a New File has the mimetype within a second level object inside an array.

To access the mimetype of existing files you must use: FileItem[0].mimetype

However, to access the mimetype for new files you need to use: FileItem[0][1].mimetype

Due to this inconsistency, I am struggling to filter the AllFiles array. Is there a way to solve this?

javascript arrays object ecmascript-6

Answer 1

Answer №1

If you want to achieve a concise solution, consider using the ?? operator:

const AllFiles = [{name:"ExistingFile1",mimetype:"image/jpg",size:"500"},["FILE",{name:"NewFile1",mimetype:"video/mp4",size:"9000"}],{name:"ExistingFile2",mimetype:"video/mp4",size:"4000"},["FILE",{name:"NewFile2",mimetype:"image/jpg",size:"500"}]];
 
const result = AllFiles.filter(f => (f[1] ?? f).mimetype.startsWith('image'));

result.forEach(r => console.log(JSON.stringify(r)));

Answer 2

If you want to achieve a concise solution, consider using the ?? operator:

const AllFiles = [{name:"ExistingFile1",mimetype:"image/jpg",size:"500"},["FILE",{name:"NewFile1",mimetype:"video/mp4",size:"9000"}],{name:"ExistingFile2",mimetype:"video/mp4",size:"4000"},["FILE",{name:"NewFile2",mimetype:"image/jpg",size:"500"}]];
 
const result = AllFiles.filter(f => (f[1] ?? f).mimetype.startsWith('image'));

result.forEach(r => console.log(JSON.stringify(r)));

Answer 3

Answer №2

If you're looking for a straightforward way to retrieve data from an array of entities, one simple approach is to first check if each entity has the mimetype property. If it does, you can access the data directly. However, if the property is not present, you can assume that the entity is an array and extract the information from the second element instead.

const File = "foo", AllFiles = [{name:"ExistingFile1",mimetype:"image/jpg",size:"500"},["foo",{name:"NewFile1",mimetype:"video/mp4",size:"9000"}],{name:"ExistingFile2",mimetype:"video/mp4",size:"4000"},["foo",{name:"NewFile2",mimetype:"image/jpg",size:"500"}]];

const filteredFiles = AllFiles.filter(entity => {
  const obj = entity.hasOwnProperty('mimetype') ? entity : entity[1];
  return obj.mimetype.startsWith("image/");
});

console.log(filteredFiles);

It's important to note that this example is just for illustrative purposes. In a real-world scenario, it would be wise to implement additional checks to ensure the accuracy and reliability of the data retrieval process. Nevertheless, the provided code snippet offers a basic template to work with.

Answer 4

If you're looking for a straightforward way to retrieve data from an array of entities, one simple approach is to first check if each entity has the mimetype property. If it does, you can access the data directly. However, if the property is not present, you can assume that the entity is an array and extract the information from the second element instead.

const File = "foo", AllFiles = [{name:"ExistingFile1",mimetype:"image/jpg",size:"500"},["foo",{name:"NewFile1",mimetype:"video/mp4",size:"9000"}],{name:"ExistingFile2",mimetype:"video/mp4",size:"4000"},["foo",{name:"NewFile2",mimetype:"image/jpg",size:"500"}]];

const filteredFiles = AllFiles.filter(entity => {
  const obj = entity.hasOwnProperty('mimetype') ? entity : entity[1];
  return obj.mimetype.startsWith("image/");
});

console.log(filteredFiles);

It's important to note that this example is just for illustrative purposes. In a real-world scenario, it would be wise to implement additional checks to ensure the accuracy and reliability of the data retrieval process. Nevertheless, the provided code snippet offers a basic template to work with.

Tips for sorting through an array containing various types of data

Answer №1

Answer №2

Similar questions

Attempting to format a number using a computed property and .toLocaleString() fails to execute

How to access the CSS and JS files in the vendor folder using linemanjs

Is the div empty? Maybe jQuery knows the answer

Using a variable to retrieve results from an array leads to an undefined outcome

Why are the elements not found by their id when I check them, even though they were created dynamically using an ajax-generated form with php-inserted values through a

Getting data from a response in Express.js involves using the built-in methods provided by

Concealing the toolbars on iOS 7 with the overlay technique

Retrieve items from a JSON file using Ionic framework's $http.get method

Execute the Angular filter again when there is a change in the scope

Using AngularJS to showcase nested JSON arrays

I'm wondering why my positive numbers aren't displayed in green and negative numbers in red

Tips for integrating external JavaScript libraries and stylesheets into a widget

Is the input field not properly centered on the page?

What could be causing the malfunction of removeEventListener in my Nuxt application?

Effortlessly saving money with just one click

Guide on comparing values in a MongoDB document field using NodeJS

Issues with jQuery Progress Bar Functionality

VueJS and Vite: Encountering an unexpected character '�' while attempting to import files that are not JavaScript. Keep in mind that plugins are required for importing such files

Optimizing Performance by Managing Data Loading in JavaScript Frameworks

How can errors for assets on a Vue build be disregarded?