'split an array into two based on condition using javascript

I have an array of objects like this below.

[
    {
        product_id: 4,
        product_name: "Samsung",
        category_name: "Tv and home appliance",
        is_Available: 1
    },
    {
        product_id: 8,
        product_name: "Apple",
        category_name: "Home gadgets",
        is_Available: 1
    },
    {
        product_id: 9,
        product_name: "Verifone",
        category_name: "Electronics",
        is_Available: 0
    }
  ]

I want to split this array into two based on is_Available flag value. So i did like this using reduce.

const formmattedResponse = data.reduce((arr,el) => {
            if(el.is_Available === 1) {
                arr.push({...el});
            }
            return arr;
        },[]);

But, i need this type of formatted data like below based on above data array

{
    availableData: [{
        product_id: 4,
        product_name: "Samsung",
        category_name: "Tv and home appliance",
        is_Available: 1
    },
    {
        product_id: 8,
        product_name: "Apple",
        category_name: "Home gadgets",
        is_Available: 1
    }
   ],
  notAvailableData: [{
        product_id: 9,
        product_name: "Verifone",
        category_name: "Electronics",
        is_Available: 0
    }
   ]
  }

javascript arrays

Solution 1:^[1]

You could take an array and push the objects according their availability with a single loop.

const
    data = [{ product_id: 4, product_name: "Samsung", category_name: "Tv and home appliance", is_Available: 1 }, { product_id: 8, product_name: "Apple", category_name: "Home gadgets", is_Available: 1 }, { product_id: 9, product_name: "Verifone", category_name: "Electronics", is_Available: 0 }],
    result = data.reduce((r, o) => {
        r[o.is_Available ? 'availableData' : 'notAvailableData'].push(o);
        return r;
    }, { availableData: [], notAvailableData: [] });

console.log(result);

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

Solution 2:^[2]

const data = [
    {
        product_id: 4,
        product_name: "Samsung",
        category_name: "Tv and home appliance",
        is_Available: 1
    },
    {
        product_id: 8,
        product_name: "Apple",
        category_name: "Home gadgets",
        is_Available: 1
    },
    {
        product_id: 9,
        product_name: "Verifone",
        category_name: "Electronics",
        is_Available: 0
    }
  ];
const result = {
  availableData:  data.filter(el => el.is_Available),
  notAvailableData:  data.filter(el => !el.is_Available),
};

console.log(result);

You can use Array.filter() to filter your array based on is_Available.

Solution 3:^[3]

You have two options: you either filter the list twice or you can add a different accumulator for your reduce function which holds two arrays.

This advantage of the reduce is that only iterate your array once, making it more efficient than the double filter.

I pass a object with 2 properties: availableData and notAvailableData as the initial value for the reduce. During the reduce, I check the property that you want to filter on and add it to the right list. In the reduce function, I return the context object so the next iteration has it also.

The reduce returns that object in the end, completing the sort.

var arr = [
  {
    product_id: 4,
    product_name: "Samsung",
    category_name: "Tv and home appliance",
    is_Available: 1
  },
  {
    product_id: 8,
    product_name: "Apple",
    category_name: "Home gadgets",
    is_Available: 1
  },
  {
    product_id: 9,
    product_name: "Verifone",
    category_name: "Electronics",
    is_Available: 0
  }
]

var context = arr.reduce((ctx, el) => {
  if (el.is_Available) {
    ctx.availableData.push(el);
  } else {
    ctx.notAvailableData.push(el);
  }
  return ctx
}, {availableData: [], notAvailableData: []})

console.log(context);

Solution 4:^[4]

modified Snippet could be like


const formmattedResponse = data.reduce((arr,el) => {
          let finalResp = { 
                  availableData: [],
                notAvailableData : []
            }
            if(el.is_Available === 1) {
                finalResp["availableData"].push({...el});
            } else {
        finalResp["notAvailableData "].push({...el});
     }
            return finalResp;
        },[]);

Solution 5:^[5]

I believe that you can find partition functions in some libraries e.g. lodash that will split an array into two arrays, one that matches the condition and another that doesn't. I've written a quick version here to demo it.

const data = [{"product_id":4,"product_name":"Samsung","category_name":"Tv and home appliance","is_Available":1},{"product_id":8,"product_name":"Apple","category_name":"Home gadgets","is_Available":1},{"product_id":9,"product_name":"Verifone","category_name":"Electronics","is_Available":0}];

const partition = (array, filter_fn) =>
  array.reduce(
    (acc, val) => (acc[filter_fn(val) ? 0 : 1].push(val), acc),
    [[], []]
  );

const new_keys = ['availableData', 'notAvailableData'];

const result = Object.fromEntries(
  partition(data, (item) => item.is_Available)
    .map((arr, i) => [new_keys[i], arr])
);

console.log(result);

Solution 6:^[6]

The lodash partition function was designed to solve this problem:

import { partition } from "lodash";
const [availableData, notAvailableData] = partition(items, "is_Available");
const formattedResponse = { availableData, notAvailableData };

where items is the array of objects given in the question.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1
Solution 2	Nicolae Maties
Solution 3	Jeffrey Devloo
Solution 4	sudarshan
Solution 5	Ben Stephens
Solution 6	Oskari Mantere

'split an array into two based on condition using javascript

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Solution 5:[5]

Solution 6:[6]