Sort array of objects having the offsets in javascript

Question

I am new to web development. Here, I do have an array which is like

[{
        endOffset: "50"
        startOffset: "25"
        type: "Education"
    },
    {
        endOffset: "67"
        startOffset: "55"
        type: "address"
    },
    {
        endOffset: "65"
        startOffset: "59"
        type: "project"
    },
    {
        endOffset: "80"
        startOffset: "70"
        type:"fullname"
    }]

In this array of objects , now I am sorting it on the basis of the endoffsets . Which is like ->

jsonDataArray.sort(function (a, b) {
            return a.startOffset - b.startOffset;
          });

Then Its giving me the sorted array. But here it is sorting on the basis of only startoffset.

What I want is that I want to have an array like which will have sort on ascending order of both start and endoffset, so that the array will be like

[{
 starOffset: "25",
 type: "Education"
}, {
 endOffset: "50"
 type: "Education" },

{
 startoffset: "55"
 type: "address" },
{
 startoffset: "59"
 type: "project" },
{
 endoffset: "65"
 type: "project" },

{
 endoffset: "67"
 type: "address" 
},
{
 endoffset: "67"
 type: "address" 
},
{
 startOffset: "70"
 type: "address" 
},
{
 endoffset: "80"
 type: "address" 
},

]

So, How can I do this ? Can any one please help me with this ?

You can check this topic: "How to sort an array of objects by multiple fields?", it seems related to your issue. — Maxime
– Maxime, Commented Apr 30, 2018 at 13:35
To save you from future headaches/problems: There's no JSON involved in your code - jsonDataArray is an array of objects and is not in any way related to JSON. — Andreas
– Andreas, Commented Apr 30, 2018 at 13:38
So if startOffset is the same you want to sort by endOffset? — HMR
– HMR, Commented Apr 30, 2018 at 13:41
So, In this case the one which appeared first will added first in array — ganesh kaspate
– ganesh kaspate, Commented Apr 30, 2018 at 13:42

Ankit Agarwal · Accepted Answer · 2018-04-30 14:01:28Z

1

First create the desired array with startOffset and endOffset in separate object then you can assign the value for aVal and bVal to sort for by having condition in your sort function as mentioned below in code:

var jsonDataArray = [{
        endOffset: "50",
        startOffset: "25",
        type: "Education"
    },
    {
        endOffset: "67",
        startOffset: "65",
        type: "address"
    },
    {
        endOffset: "65",
        startOffset: "59",
        type: "project"
    },
    {
        endOffset: "80",
        startOffset: "70",
        type:"fullname"
    }];

var newJSON = [];
jsonDataArray.forEach((obj)=>{
  var  tempObj = {
     endOffset: obj.endOffset,
     type: obj.type
  };
  newJSON.push(tempObj);
  tempObj = {
     startOffset: obj.startOffset,
     type: obj.type
  };
  newJSON.push(tempObj);
});
newJSON.sort(function (a, b) {
  var aVal = a.startOffset?a.startOffset:a.endOffset;
  var bVal = b.startOffset?b.startOffset:b.endOffset;
  return aVal - bVal;
});
console.log(newJSON);

edited Apr 30, 2018 at 14:01

answered Apr 30, 2018 at 13:36

Ankit Agarwal

30.8k5 gold badges41 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

ganesh kaspate Over a year ago

Here the first one is my jsonData array. The next one is my expected output.

ganesh kaspate Over a year ago

Hey, what will happen if the offsets are same ?

Ankit Agarwal Over a year ago

They will still work because there is a condition there if it found startOffset present in object it will use that else it will use endOffset and the code is certain that there will be either startOffset or endOffset @ganeshkaspate

Ankit Agarwal Over a year ago

@ganeshkaspate you can use this instead of really abstract code as this will allow you to change your code easily and it is also lot more understanding when you look at a glance

ganesh kaspate Over a year ago

Okay Ankit. Thanks for the help. Great solution.

|

Nina Scholz · Accepted Answer · 2018-04-30 14:32:33Z

You could create a new array with start and end values and sort them by taking either the start or end value.

var data = [{ endOffset: "50", startOffset: "25", type: "Education" }, { endOffset: "67", startOffset: "55", type: "address" }, { endOffset: "65", startOffset: "59", type: "project" }, { endOffset: "80", startOffset: "70", type: "fullname" }],
    extended = data.reduce(
        (r, { endOffset, startOffset, type }) =>
            r.concat({ startOffset, type }, { endOffset, type }), []);

extended.sort((a, b) => (a.startOffset || a.endOffset) - (b.startOffset || b.endOffset));

console.log(extended);

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

ES5

var data = [{ endOffset: "50", startOffset: "25", type: "Education" }, { endOffset: "67", startOffset: "55", type: "address" }, { endOffset: "65", startOffset: "59", type: "project" }, { endOffset: "80", startOffset: "70", type: "fullname" }],
    extended = data.reduce(function (r, o) {
        return r.concat(
            { startOffset: o.startOffset, type: o.type },
            { endOffset: o.endOffset, type: o.type }
        );
    }, []);

extended.sort(function (a, b) {
    return (a.startOffset || a.endOffset) - (b.startOffset || b.endOffset);
});

console.log(extended);

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

HMR · Accepted Answer · 2018-04-30 14:17:41Z

0

The following sorts on startOffset first then by endOffset:

const array = [{
  endOffset: "50",
  startOffset: "25",
  type: "Education"
},
{
  endOffset: "67",
  startOffset: "55",
  type: "address"
},
{
  endOffset: "65",
  startOffset: "59",
  type: "project"
},
{
  endOffset: "80",
  startOffset: "70",
  type:"fullname"
}]

console.log(
  array.reduce(
    (result,item)=>result.concat([
      {startOffset:item.startOffset,type:item.type},
      {endOffset:item.endOffset,type:item.type}
    ]),
    []
  ).sort(
    (a,b)=>(a.startOffset||a.endOffset)-(b.startOffset||b.endOffset)
  )
)

edited Apr 30, 2018 at 14:17

answered Apr 30, 2018 at 13:46

HMR

39.5k26 gold badges99 silver badges176 bronze badges

5 Comments

ganesh kaspate Over a year ago

And I am using ES5

HMR Over a year ago

@ganeshkaspate Then you use type functrion(){return instead of ()=>

ganesh kaspate Over a year ago

This is nice .Actually, I want to have this in the seperate way, like the array which I given.

ganesh kaspate Over a year ago

It does not natter for me start or end as long as there is an ascending order .

HMR Over a year ago

@ganeshkaspate Ok, I think I understand what you wanted. Updated the answer.

Collectives™ on Stack Overflow

Sort array of objects having the offsets in javascript

3 Answers 3

7 Comments

Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

7 Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related