Retrieve a highly nested property within an array of objects

Below is the snippet of code:

var ops = [{
    label: 'Primary Colors',
    options: [{
        label: 'Yellow',
        value: 'yellow'
    }, {
        label: 'Red',
        value: 'red'
    }, {
        label: 'Blue',
        value: 'blue'
    }],
    label: 'Secondary Colors',
    options: [{
        label: 'Pink',
        value: 'yellow'
    }, {
        label: 'Pink',
        value: 'pink'
    }, {
        label: 'Violet',
        value: 'violet'
    }]
}

I am looking for a way to extract all values from the 'value' field inside the options array and store them in a variable like this:

values = [yellow, red, blue, yellow, pink, violet]
. Do you have any suggestions on how to achieve this?

Answer №1

To achieve this task using Javascript, you can utilize the forEach method.

var ops=[{label: 'Primary Colors',
options: [{label: 'Yellow',value: 'yellow'},
{label: 'Red',value: 'red'},
{label: 'Blue',value: 'blue'}]},
{label: 'Secondary Colors',
options: [{label: 'Pink',value: 'yellow'},{label: 'Pink',value: 'Pink'},{label: 'Violet',value: 'violet'}]}];      

var arr =[];var obj = [];
arr = ops.forEach(function(o){
  var a = o.options;
  a.forEach(function(option) {
    
    obj.push(option.value);
});
});
console.log(obj);

Check out the working demo on Fiddle

Note: The data provided has been modified slightly due to some closing tags (}]) not being in the correct order.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The significance of Token Details in Tokbox

I'm currently working on developing a video chat platform that caters to various user roles - some may just observe while others actively participate in calls. I've been exploring the capabilities of the Tokbox Api () which allows metadata to be ...

Enhancing ajax content with Rx.Observable.fromEvent: A step-by-step guide

I am currently fetching content using Ajax, in the form of a json object, which is then displayed in the browser. var stateSubjectSub = stateSubject.subscribe(function(data) { console.log('state changes'); console.log(data); var list = document ...

What is the reason for using a callback as a condition in the ternary operator for the Material UI Dialog component?

I am in the process of reconstructing the Material UI Customized Dialog component based on the instructions provided in this particular section of the documentation. However, I am unable to grasp the purpose behind using a callback function onClose conditi ...

What is the method for invoking an anonymous JavaScript object when its name is unknown?

I've been dynamically loading JavaScript modules with jQuery's getScript function. I want to be able to call an init method that all of these modules contain. Since the modules are loaded dynamically, I would rather not hard code their names. Is ...

Unleash full rotation capabilities in OrbitControls.js

Currently, I am utilizing OrbitControls.js to rotate the camera around a fixed point. My intention is not to restrict any vertical rotation - my goal is for the camera to smoothly circle the model (orbits around the pivot point). I experimented with remov ...

"Please note that the function of the enter key to navigate between form fields is

When I use the enter key to move between form fields, it's not working as expected: The cursor doesn't move to another field in the form when I press the enter key. Removing the submit button allows the enter key to work properly. The issue se ...

Enhancing Performance of D3 JS for Visualizing Large XML Data

I am working on visualizing a large XML file, almost 1 GB in size, as a graph of nodes and links using D3 Javascript. I am currently working with mac 10.5.8. I have successfully extracted the content of the file, displaying it as: [Object Element]. The p ...

What are the steps to execute a filter operation on a table by utilizing two select box values with jQuery?

I have a challenge with two dropdown menus. One contains names and the other subjects, along with a table displaying information in three columns: name, subject, and marks. I would like to implement a filter based on the selections in these two dropdowns. ...

Ways to rotate SVG images exclusively upon clicking

After experimenting with rotating SVG images on my navbar buttons, I encountered an issue. Whenever I click one button, all the images rotate simultaneously. Additionally, clicking elsewhere does not reset the images to their original positions. This is t ...

Error in Layout of Navigation Panel and Tabbed Pages

Working on a school project, I encountered a challenge. I found two useful solutions from the W3 website - a sticky navigation bar and the ability to include tabs on a single page for a cleaner presentation of information. However, when trying to implement ...

Tracking JavaScript buttons with Klaviyo

I am currently facing an issue with a JavaScript script I have implemented to track button clicks on my website and send information to Klaviyo. I have set up a flow in Klaviyo to send emails based on the button click "Add To Wishlist," but for some reason ...

The code in check.js causes a square of dots to emerge on the screen in Skype

Trying to add a Skype call button to my page has been successful, but there's one issue - a pesky white dot keeps appearing at the bottom of the footer. The script source I used is as follows: <script src="http://download.skype.com/share/skypebu ...

Error: 'require is not defined' pops up while trying to import into App.js for a React App built with CDN links

My latest project involves a React App that showcases an h1 tag saying "Hello World" on the browser. Rather than utilizing npm, I have opted for CDN links to set up the application. The structure of the App consists of three key files: An index.html file ...

Why does the address bar show value changes in IE when using window.location.hash, but the value doesn't change in the DOM when going

Here is a sample JavaScript code that attempts to detect the back button event: document.location.hash="#1"; document.location.hash="#2"; document.location.hash="#3"; function check() { if("#3"!=window.location.hash) { alert("Back button clic ...

Leveraging Selenium Basic with Excel Version 16 to Manipulate Arrays within "div" Tags

Currently, I am extracting data through Web scraping from a Chrome web page in Excel v.16 with the help of Selenium Basic. Due to the sensitive nature of patient information, I must be cautious about disclosing too much detail. (Initially, I developed the ...

How can I delete the black background from the ion-tab-bar in Ionic 7?

In my current project using Ionic 7, I have a navigation guide set up with 4 tabs. I am trying to customize the styling of these ion tabs by adding some custom CSS. The issue I'm facing is that despite my attempts to make the background transparent, ...

Ways to update the select field without having to reload the entire page

I am working on a unique feature that involves two levels of drop down menus. When a user makes a selection in the first level, a corresponding set of options will appear in the second level. For example, I have 6 options in the first level, each with its ...

How can I sort by the complete timestamp when using the Antd table for dates?

I have an item in my possession. const data: Item[] = [ { key: 1, name: 'John Brown', date: moment('10-10-2019').format('L'), address: 'New York No. 1 Lake Park', }, { ...

Having issues with my Bootstrap navigation dropdown - any suggestions on what I might be overlooking?

I'm having trouble getting the bootstrap dropdown and button to function properly when the menu collapses on tablet or mobile view. Below is my HTML code for the navigation: <nav class="navbar navbar-default navbar-fixed-top"> <div c ...

Sending information to a PHP script using Ajax

I am working on a project that involves input fields sending data to a PHP page for processing, and then displaying the results without reloading the page. However, I have encountered an issue where no data seems to be passed through. Below is my current s ...