how to shift an object in array to be on top in javascript / vue.js

Question

const a = [{
    "iso2": "KH",
    "countryName": "Cambodia",
    "nationality": "Cambodian"
},
{
    "iso2": "KI",
    "countryName": "Kiribati",
    "nationality": "I-Kiribati"
},
{
    "iso2": "KM",
    "countryName": "Comoros",
    "nationality": "Comoran, Comorian"
},
{
    "iso2": "KN",
    "countryName": "Saint Kitts and Nevis",
    "nationality": "Kittitian or Nevisian"
}];

i have an array from Get Api list and i intended to move isow = KN to be on top of the list to be sync with select list option. i know about push and unshift method. but is there is another easiest way to move an object in Array to be on top of the list?

There's also splice(), which lets you insert and remove anywhere in the list. But if it's always first and last, use push, pop, shift, and unshift. — Barmar
– Barmar, Commented Jan 16, 2020 at 7:40
if the object is in the mid i could use splice? and if i want it to be on top i need to shift or push? — Khairul Habib
– Khairul Habib, Commented Jan 16, 2020 at 7:49

arizafar · Accepted Answer · 2020-01-16 08:10:16Z

You dont need to sort the complete array if you just want to move the element to the start and do not care about the order of other elements.

You can simply find the index of the element and swap it with the first one.

const a = [{
	"iso2": "KH",
	"countryName": "Cambodia",
	"nationality": "Cambodian"
},
{
	"iso2": "KI",
	"countryName": "Kiribati",
	"nationality": "I-Kiribati"
},
{
	"iso2": "KM",
	"countryName": "Comoros",
	"nationality": "Comoran, Comorian"
},
{
	"iso2": "KN",
	"countryName": "Saint Kitts and Nevis",
	"nationality": "Kittitian or Nevisian"
}];

let index = a.findIndex(e => e.iso2 === 'KN');

a[0] = (_=a[index], a[index] = a[0],_);
console.log(a)

Or can remove the element using Array.splice and then unshift.

const a = [{
	"iso2": "KH",
	"countryName": "Cambodia",
	"nationality": "Cambodian"
},
{
	"iso2": "KI",
	"countryName": "Kiribati",
	"nationality": "I-Kiribati"
},
{
	"iso2": "KN",
	"countryName": "Saint Kitts and Nevis",
	"nationality": "Kittitian or Nevisian"
},
{
	"iso2": "KM",
	"countryName": "Comoros",
	"nationality": "Comoran, Comorian"
}];

let index = a.findIndex(e => e.iso2 === 'KN');
e = a.splice(index,1);
a.unshift(...e)
console.log(a)

felixmosh · Accepted Answer · 2020-01-16 07:52:54Z

0

You can use Array.sort to re-order the array as you wish.

const a = [{
    "iso2": "KH",
    "countryName": "Cambodia",
    "nationality": "Cambodian"
  },
  {
    "iso2": "KI",
    "countryName": "Kiribati",
    "nationality": "I-Kiribati"
  },
  {
    "iso2": "KM",
    "countryName": "Comoros",
    "nationality": "Comoran, Comorian"
  },
  {
    "iso2": "KN",
    "countryName": "Saint Kitts and Nevis",
    "nationality": "Kittitian or Nevisian"
  }
];

a.sort((item1) => item1.iso2 === 'KN' ? -1 : 1);

console.log(a);

edited Jan 16, 2020 at 7:52

answered Jan 16, 2020 at 7:45

felixmosh

35.8k10 gold badges81 silver badges99 bronze badges

4 Comments

Khairul Habib Over a year ago

sorry, but actually the are more than just this data. and the kn is actually in the mid of data.

Khairul Habib Over a year ago

all country name and iso in world

felixmosh Over a year ago

And you want to move only 'KN' to the start?

felixmosh Over a year ago

I've changed my answer

Evan · Accepted Answer · 2020-01-16 07:58:00Z

0

try this:

 let data = [
      {
        iso2: "KH",
        countryName: "Cambodia",
        nationality: "Cambodian"
      },
      {
        iso2: "KI",
        countryName: "Kiribati",
        nationality: "I-Kiribati"
      },
      {
        iso2: "KM",
        countryName: "Comoros",
        nationality: "Comoran, Comorian"
      },
      {
        iso2: "KN",
        countryName: "Saint Kitts and Nevis",
        nationality: "Kittitian or Nevisian"
      }
    ];

    let one = "KN";
    data.sort((x, y) => (x.iso2 == one ? -1 : y.iso2 == one ? 1 : 0));
    console.log(data);

answered Jan 16, 2020 at 7:58

Evan

2,5277 gold badges40 silver badges72 bronze badges

Comments

Anuj Gupta · Accepted Answer · 2020-01-16 19:06:26Z

0

You can simply reverse your array if you want to last object on top. a.reverse();

answered Jan 16, 2020 at 19:06

Anuj Gupta

213 bronze badges

Collectives™ on Stack Overflow

how to shift an object in array to be on top in javascript / vue.js

4 Answers 4

Comments

4 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related