Sort only few objects from an array of object coming from api response in React

Question

I am looking for an efficient way of sorting the API response which is array of Objects. This Array has many fields and I just want to sort only few of them.

The Array looks like this

result =  {type: Array(), status: Array(), nature: Array(), health: Array(), fitness: Array(), wealth: Array()}

and Array have name and value property like {name:"", value:""}

so let's say I just need to sort type, status, and nature out of this result. The thing that I have tried now looks like this which juts sorts one of the records.

const typeName = "type"
if(result[typeName]){
    result[typeName] = sortingFunction(result[typeName], "name")
}

Now I need to sort other fields as well and also for few fields I need to sort on the basis of "value" property as well. So please let me know if you have any efficient way of doing this.

Modify your code to take key as parameter.

Hassan Imam
– Hassan Imam

2020-03-17 05:13:13 +00:00
Commented Mar 17, 2020 at 5:13 — Hassan Imam
– Hassan Imam, Commented Mar 17, 2020 at 5:13

Community · Accepted Answer · 2020-06-20 09:12:55Z

You could create a sort function which can sort the given input object for the given keys.

I have create a sample function for sorting.

This function has two parameters.

First the object which needs to be sorted

Second option, you can pass the option for sort.
a. sortBy: Name of the property on which the function will perform the sort .
b. sortKeys: Array | String, the keys/key of the object which need to be sorted.

Function:

function sortObject(input, options = {}) {
    if (!options)
        return;

    let keys = options.sortKeys;
    let sortBy = options.sortby



    if (!sortBy) {
        console.error("sort by option is not defiend");
        return;
    }

    if (!keys) {
        console.error("sort keys are not defiend");
        return;
    }


    if (Array.isArray(keys) && keys.length > 0) {
        keys.forEach(item => sortObjectByKey(item, sortBy));
        return;
    }

    if (typeof keys === "string" && keys) {
        sortObjectByKey(keys, sortBy);
        return;
    }

    function sortObjectByKey(sortKey, sortBy) {
        input[sortKey].sort(function (a, b) {
            let _a = (typeof a[sortBy] === "string") ? a[sortBy].toLowerCase() : a[sortBy];
            let _b = (typeof b[sortBy] === "string") ? b[sortBy].toLowerCase() : b[sortBy];
            if (_a < _b)
                return -1
            if (_a > _b)
                return 1
            return 0
        });
    }
}

Example:

//sortObject(sampleObject, { sortby: ["name", "value"], sortKeys: ["status", "type"] });
function sortObject(input, options = {}) {
    if (!options)
        return;

    let keys = options.sortKeys;
    let sortBy = options.sortby



    if (!sortBy) {
        console.error("sort by option is not defiend");
        return;
    }

    if (!keys) {
        console.error("sort keys are not defiend");
        return;
    }


    if (Array.isArray(keys) && keys.length > 0) {
        keys.forEach(item => sortObjectByKey(item, sortBy));
        return;
    }

    if (typeof keys === "string" && keys) {
        sortObjectByKey(keys, sortBy);
        return;
    }

    function sortObjectByKey(sortKey, sortBy) {
        input[sortKey].sort(function (a, b) {
            let _a = (typeof a[sortBy] === "string") ? a[sortBy].toLowerCase() : a[sortBy];
            let _b = (typeof b[sortBy] === "string") ? b[sortBy].toLowerCase() : b[sortBy];
            if (_a < _b)
                return -1
            if (_a > _b)
                return 1
            return 0
        });
    }
}

let sampleObject = {
    type: [
        { name: "c", value: 4 },
        { name: "a", value: 2 },
        { name: "b", value: 1 },
        { name: "d", value: 3 },
    ],
    status: [
        { name: "c", value: 25 },
        { name: "a", value: 25 },
        { name: "b", value: 25 },
        { name: "d", value: 25 },
    ],
    nature: [
        { name: "c", value: 25 },
        { name: "a", value: 25 },
        { name: "b", value: 25 },
        { name: "d", value: 25 },
    ],
}
sortObject(sampleObject, { sortby: "value", sortKeys: ["type"] });
sortObject(sampleObject, { sortby: "name", sortKeys: ["status", "nature"] });
console.log(sampleObject)

Ja͢ck · Accepted Answer · 2020-03-17 06:22:01Z

1

One way is to translate the object of arrays into an array of objects, then merge it back after sorting.

const result = {
  type: ['foo', 'bar', 'baz'], 
  status: [4, 3, 5],
  nature: ['forest', 'animal', 'water'],
  health: ['athlete', 'couch potato', 'dead'],
  fitness: [200, 50, 60],
  wealth: [5, 2, 99]
};

// 1. combine
const combined = result.type.map((_, index) => {
  return Object.fromEntries(Object.keys(result).map(key => [key, result[key][index]]));
});

// 2. example sort by status
combined.sort((a, b) => a.status - b.status)

// 3. merge
combined.forEach((object, index) => {
  for (const [key, value] of Object.entries(object)) {
    result[key][index] = value
  }
})

console.log(result);

answered Mar 17, 2020 at 6:22

Ja͢ck

174k39 gold badges269 silver badges316 bronze badges

Collectives™ on Stack Overflow

Sort only few objects from an array of object coming from api response in React

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related