i have below common function for sorting,
export const sortSelectOptions = (options, sortByKey = 'name', type) => { switch (type) { case 'alphaNumeric': return options .slice() .sort((a, b) => Math.sign( parseInt(a.name.replace(/["]$/, ''), 10) - parseInt(b.name.replace(/["]$/, ''), 10) ) ); case 'numeric': return options.slice().sort((a, b) => (a.nominalSize > b.nominalSize ? 1 : -1)); default: return sortBy(options, sortByKey) } }
and i am calling above function like as below,
options => sortSelectOptions(options, null, 'numeric')
for numeric type i am sorting based on nominalSize
, now i would like to pass this field directly from here sortSelectOptions(options, null, 'numeric')
as prop. The options are array of objects and one of the property is nominalSize
. I am looking kind of generic sorting function.
Could any one please let me know how can i pass exact field as a prop to common function to achieve sorting functionality.
many thanks in advance
Advertisement
Answer
If I understand you correctly, you want the logic for accessing the value to sort by outside of the sort function?
You can make properties accessible through their name like so:
export const sortSelectOptions = (options, sortByKey = 'name', type, fieldName) => { switch (type) { case 'alphaNumeric': return options .slice() .sort((a, b) => Math.sign( parseInt(a.name.replace(/["]$/, ''), 10) - parseInt(b.name.replace(/["]$/, ''), 10) ) ); case 'numeric': return options.slice().sort((a, b) => (a[fieldName] > b[fieldName] ? 1 : -1)); default: return sortBy(options, sortByKey) } }
And call it with:
options => sortSelectOptions(options, null, 'numeric', 'nominalSize')
Or you can generalize this pattern and ask for an accessor function like so:
export const sortSelectOptions = (options, sortByKey = 'name', type, accessor) => { switch (type) { case 'alphaNumeric': return options .slice() .sort((a, b) => Math.sign( parseInt(accessor(a).replace(/["]$/, ''), 10) - parseInt(accessor(b).replace(/["]$/, ''), 10) ) ); case 'numeric': return options.slice().sort((a, b) => (accessor(a) > accessor(b) ? 1 : -1)); default: return sortBy(options, sortByKey) } }
And call it with:
options => sortSelectOptions(options, null, 'numeric', x => x.nominalSize) options => sortSelectOptions(options, null, 'alphaNumeric', x => x.name)
The latter version would allow you to also access deeply nested properties.