Discovering Worth within a Set of Embedded Arrays

Question

Discovering Worth within a Set of Embedded Arrays

I am currently in search of a solution for matching a value within an array of objects.

My approach involves using the find method, which has been effective so far. However, I've encountered a scenario where I need to assign multiple values to a single key in one of those objects.

Below is the code snippet representing my current setup:

const snack = "strawberry";

const fruits = [
    { label: "yellowFruit", value: "banana" },
    { label: "purpleFruit", value: "grape" },
    { label: "redFruit", value: "apple" },
    { label: "greenFruit", value: "watermelon" },
];

This is how I'm currently finding the desired value:

fruits.find(fruit => fruit.value === snack) || fruits[0]

The challenge arises when I try to associate two values with the label redFruit, without duplicating the label itself. The revised object structure below illustrates this, but unfortunately, the find method cannot accommodate this new format.

Revised code structure:

const snack = "strawberry";

const fruits = [
    { label: "yellowFruit", value: "banana" },
    { label: "purpleFruit", value: "grape" },
    {
        label: "redFruit",
        value: [
            { val: "apple" },
            { val: "strawberry" }
        ]
    },
    { label: "greenFruit", value: "watermelon" },
];

Due to this modification, attempting to find the value strawberry using the existing code no longer returns a match:

fruits.find(fruit => fruit.value === snacks) || fruits[0]

If anyone could offer assistance with this issue, it would be greatly appreciated.

javascript arrays ecmascript-6 filter find

Answer 1

Answer №1

To achieve the desired outcome, it is important to choose a different approach based on the type of property in the value field. If the value is an array, then utilizing the Array#some method is recommended.

let res = fruits.find(({ value }) => Array.isArray(value) ? value.some(({ val }) => val === snacks) : value === snacks) || fruits[0]

const snacks = "strawberry";

const fruits = [{
    label: "yellowFruit",
    value: "banana"
  },
  {
    label: "purpleFruit",
    value: "grape"
  },
  {
    label: "redFruit",
    value: [{
        val: "apple"
      },
      {
        val: "strawberry"
      }
    ]
  },
  {
    label: "greenFruit",
    value: "waltermelon"
  },
];

let res = fruits.find(({ value }) => Array.isArray(value) ? value.some(({ val }) => val === snacks) : value === snacks) || fruits[0]

console.log(res);

Answer 2

To achieve the desired outcome, it is important to choose a different approach based on the type of property in the value field. If the value is an array, then utilizing the Array#some method is recommended.

let res = fruits.find(({ value }) => Array.isArray(value) ? value.some(({ val }) => val === snacks) : value === snacks) || fruits[0]

const snacks = "strawberry";

const fruits = [{
    label: "yellowFruit",
    value: "banana"
  },
  {
    label: "purpleFruit",
    value: "grape"
  },
  {
    label: "redFruit",
    value: [{
        val: "apple"
      },
      {
        val: "strawberry"
      }
    ]
  },
  {
    label: "greenFruit",
    value: "waltermelon"
  },
];

let res = fruits.find(({ value }) => Array.isArray(value) ? value.some(({ val }) => val === snacks) : value === snacks) || fruits[0]

console.log(res);

Answer 3

Answer №2

Keeping data uncomplicated:

const treat = "blueberry";

const snacks = [
    { label: "yellowSnack", value: "banana" },
    { label: "purpleSnack", value: "grape" },
    { label: "redSnack", value: "apple" },
    { label: "redSnack", value: "strawberry" },
    { label: "greenSnack", value: "waltermelon" },
];

... and your script will be straightforward as well:

const outcome = snacks.find(({ value }) => value === treat)

Answer 4

Keeping data uncomplicated:

const treat = "blueberry";

const snacks = [
    { label: "yellowSnack", value: "banana" },
    { label: "purpleSnack", value: "grape" },
    { label: "redSnack", value: "apple" },
    { label: "redSnack", value: "strawberry" },
    { label: "greenSnack", value: "waltermelon" },
];

... and your script will be straightforward as well:

const outcome = snacks.find(({ value }) => value === treat)

Answer 5

Answer №3

If you're looking to check if a specific item exists in an array of fruits, here's how you can do it:

const snack = "strawberry";

const fruits = [{
    label: "yellowFruit",
    value: "banana"
  },
  {
    label: "purpleFruit",
    value: "grape"
  },
  {
    label: "redFruit",
    value: [{
        val: "apple"
      },
      {
        val: "strawberry"
      }
    ]
  },
  {
    label: "greenFruit",
    value: "watermelon"
  },
];

let itemExists = fruits.some(item =>
  Array.isArray(item.value) ?
  item.value.some(subItem => subItem.val === snack) :
  item.value === snack);
  
console.log(itemExists);

By using this method, you'll get a boolean result indicating whether the item exists or not. Hope that explanation helps!

Answer 6

If you're looking to check if a specific item exists in an array of fruits, here's how you can do it:

const snack = "strawberry";

const fruits = [{
    label: "yellowFruit",
    value: "banana"
  },
  {
    label: "purpleFruit",
    value: "grape"
  },
  {
    label: "redFruit",
    value: [{
        val: "apple"
      },
      {
        val: "strawberry"
      }
    ]
  },
  {
    label: "greenFruit",
    value: "watermelon"
  },
];

let itemExists = fruits.some(item =>
  Array.isArray(item.value) ?
  item.value.some(subItem => subItem.val === snack) :
  item.value === snack);
  
console.log(itemExists);

By using this method, you'll get a boolean result indicating whether the item exists or not. Hope that explanation helps!

Discovering Worth within a Set of Embedded Arrays

Answer №1

Answer №2

Answer №3

Similar questions

Optimal method for showcasing a menu featuring items stored in arrays

Effectively eliminating elements from the DOM

An error occurs in Appium code stating "SyntaxError: await can only be used in an async function"

Building a properly formatted JSON object using JavaScript

Issue with displaying content in AngularJS view set by a service

Having trouble loading a component in VueJS with router in Vue.js 3?

Adjusting the maximum value in the Angular Bootstrap UI rating system using ng-model

Incorporating an SVG file within an img tag

Ways to implement the React.FC<props> type with flexibility for children as either a React node or a function

Dealing with currency symbols in Datatables and linking external sources

What is the method for retrieving a gzip file using jQuery?

A guide on acquiring interactive documents from Google Drive

jQuery post method not transmitting POST data successfully

What is the best way to display toastr messages in an Angular application?

How can I trigger a click event on a link using JQuery?

Encountering a 404 error in a Next.js application while utilizing path parameters

Challenges Faced when Connecting JavaScript to HTML

We could not locate the requested resource with a DELETE request using the fetch JSON method

Tips for handling uncaught exceptions in Internet Explorer

"Encountering an error in Vue.js when trying to dynamically access nested arrays: push function not