Discover the initial two instances of a specific element within a collection of javascript objects

Question

Discover the initial two instances of a specific element within a collection of javascript objects

Within my javascript arraylist, I am currently storing the following elements:

list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
]

My question is how can I filter the array to retrieve only the first 2 occurrences of the element "header"?

The expected output would be:

list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""}
]

I'm looking for a feasible and efficient solution to achieve this using javascript.

javascript arrays

Answer 1

Answer №1

To extract non-header items from the array, you can filter it based on the count parameter. If a header item is encountered, decrement the count.

const
    topHeaders = (array, count = 2) =>
        array.filter(({ header }) => count && (!header || count--));

console.log(topHeaders([]));
console.log(topHeaders([{ header: "header1" }]));
// Other test cases...

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

To extract non-header items from the array, you can filter it based on the count parameter. If a header item is encountered, decrement the count.

const
    topHeaders = (array, count = 2) =>
        array.filter(({ header }) => count && (!header || count--));

console.log(topHeaders([]));
console.log(topHeaders([{ header: "header1" }]));
// Other test cases...

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

Here is a custom solution just for you.

let count = 0;
const searchKey = 'header';
const resultList = [];
for(let index=0; index<list.length; index++)
{
    const object = list[index];
    for(const property in object)
    {
        if(property === searchKey)
        {
            resultList.push(object);
            count++;
        }
    }
    if(count === 2)
    {
        break;
    }
}

Your desired output will be stored in resultList.

Answer 4

Here is a custom solution just for you.

let count = 0;
const searchKey = 'header';
const resultList = [];
for(let index=0; index<list.length; index++)
{
    const object = list[index];
    for(const property in object)
    {
        if(property === searchKey)
        {
            resultList.push(object);
            count++;
        }
    }
    if(count === 2)
    {
        break;
    }
}

Your desired output will be stored in resultList.

Answer 5

Answer №3

Your code is presented below:

 var list = [{header: "header1", code: ""}, {label: "label1", price: 10}, {header: "header2", code: ""}, {header: "header3", code: ""}, {header: "header4", code: ""}];

     var j = 0;
     list = list.filter((ar, i) => {
 if(ar.hasOwnProperty('header') && j < 2){
j++;       
return ar;
     }
     });

     console.log(list);

Answer 6

Your code is presented below:

 var list = [{header: "header1", code: ""}, {label: "label1", price: 10}, {header: "header2", code: ""}, {header: "header3", code: ""}, {header: "header4", code: ""}];

     var j = 0;
     list = list.filter((ar, i) => {
 if(ar.hasOwnProperty('header') && j < 2){
j++;       
return ar;
     }
     });

     console.log(list);

Answer 7

Answer №4

To simplify the process, filter the list and extract the first two elements as shown below.

const  list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
];

const headersArray = list.filter((item) =>
  item.header
).slice(0, 2);


console.log("The extracted headers are ", headersArray)

Answer 8

To simplify the process, filter the list and extract the first two elements as shown below.

const  list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
];

const headersArray = list.filter((item) =>
  item.header
).slice(0, 2);


console.log("The extracted headers are ", headersArray)

Answer 9

Answer №5

In this code snippet, I am adding objects to a new array one by one while keeping track of the number of objects with a header. If the count of objects with a header reaches 2, the process stops.

const list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
], maxHeader = 2
let result = [], headCounter = 0
list.forEach(item => {
  if (headCounter < maxHeader){
    if (item.header) headCounter++
    result.push(item)
  }
})
console.log(result)

Answer 10

In this code snippet, I am adding objects to a new array one by one while keeping track of the number of objects with a header. If the count of objects with a header reaches 2, the process stops.

const list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
], maxHeader = 2
let result = [], headCounter = 0
list.forEach(item => {
  if (headCounter < maxHeader){
    if (item.header) headCounter++
    result.push(item)
  }
})
console.log(result)

Answer 11

Answer №6

Applying Reduce method :

list.reduce(function (accumulator, currentValue) {

if(accumulator.length < 3 && currentValue.hasOwnProperty('title')){
  accumulator.push(currentValue);
}
 return accumulator;
}, []);

Answer 12

Applying Reduce method :

list.reduce(function (accumulator, currentValue) {

if(accumulator.length < 3 && currentValue.hasOwnProperty('title')){
  accumulator.push(currentValue);
}
 return accumulator;
}, []);

Answer 13

Answer №7

The following code snippet is tailored for your specific scenario.

const items = [
    {title: "Item 1", quantity: 2, price: 10},
    {title: "Item 2", quantity: 1, price: 20}
]

let totalItems = 0
let totalPrice = 0

items.map(item => {
    if(item["quantity"]){
        totalItems += item.quantity;
    }
    
    if(item["price"]){
        totalPrice += (item.quantity * item.price);
    }
})

console.log("Total items: ", totalItems)
console.log("Total price: $", totalPrice)

Answer 14

The following code snippet is tailored for your specific scenario.

const items = [
    {title: "Item 1", quantity: 2, price: 10},
    {title: "Item 2", quantity: 1, price: 20}
]

let totalItems = 0
let totalPrice = 0

items.map(item => {
    if(item["quantity"]){
        totalItems += item.quantity;
    }
    
    if(item["price"]){
        totalPrice += (item.quantity * item.price);
    }
})

console.log("Total items: ", totalItems)
console.log("Total price: $", totalPrice)

Answer 15

Answer №8

const newArray = [];
let counter = 0;
for(let index = 0, length = data.length; index < length; index++) {
    if(counter >= 2){
        break
    }
    data[index]['header'] ? counter++ : '';
    newArray.push(data[index]);
}

console.log(newArray);

I trust this aids you in your endeavors!

Answer 16

const newArray = [];
let counter = 0;
for(let index = 0, length = data.length; index < length; index++) {
    if(counter >= 2){
        break
    }
    data[index]['header'] ? counter++ : '';
    newArray.push(data[index]);
}

console.log(newArray);

I trust this aids you in your endeavors!

Answer 17

Answer №9

Here are the steps to achieve this:

Utilize the filter() method to extract all elements with the property header
Apply the findIndex() function on the array list to locate the desired element 2.
Use the slice() method to obtain a portion of the array starting from the initial header until the required header, determined by passing the index discovered through findIndex to the slice()

const list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
]

const getItems = (arr,num) => list.slice(0,arr.findIndex(a => a === arr.filter(x => x.hasOwnProperty('header'))[num-1])+1)

console.log(getItems(list,2));
console.log(getItems([ {header: "header1", code: ""}, {header: "header2", code: ""}],2));

Answer 18

Here are the steps to achieve this:

Utilize the filter() method to extract all elements with the property header
Apply the findIndex() function on the array list to locate the desired element 2.
Use the slice() method to obtain a portion of the array starting from the initial header until the required header, determined by passing the index discovered through findIndex to the slice()

const list = [
 {header: "header1", code: ""},
 {label: "label1", price: 10},
 {header: "header2", code: ""},
 {header: "header3", code: ""},
 {header: "header4", code: ""}
]

const getItems = (arr,num) => list.slice(0,arr.findIndex(a => a === arr.filter(x => x.hasOwnProperty('header'))[num-1])+1)

console.log(getItems(list,2));
console.log(getItems([ {header: "header1", code: ""}, {header: "header2", code: ""}],2));

Discover the initial two instances of a specific element within a collection of javascript objects

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Answer №6

Answer №7

Answer №8

Answer №9

Similar questions

Add an event listener to a specific class in order to control the visibility of its child elements by

Accessing array values depending on DOM response

Guidelines for utilizing recursion in order to calculate the sum of specified values within a multidimensional array

Calling Ajax in JavaScript

Utilizing an npm Package in Laravel - Dealing with ReferenceError

What category does React.js fall under - library or framework?

How can you store a Json Object with nested arrays, including other Json objects, in a single table in an SQL database?

Modify the numerical presentation within the provided input text

Difficulty arises when trying to extract specific information from an ajax response using the jQuery.filter

Creating visual content on Canvas using JavaScript

I am having difficulty accessing the environment variable stored in my Azure App Service configuration within my REACT application

Converting data from a JSON-like file format into valid JSON using JavaScript

Develop fresh JavaScript code using JavaScript

What is the best way to send $(this) to a function?

Difficulty in toggling on and off several form elements with JavaScript

Step-by-step guide on invoking a recursive function asynchronously in JavaScript

Issues with Angular updating the *ngFor Loop

I am encountering an issue with a JS addition operator while working with node.js and fs library

How can the color of the wishlist icon be modified in Reactjs when the item is available in the database?

The content of InnerHtml does not appear on the screen