How can I manually sort (move) array elements around, in react and/or javascript?

Question

Say I have this array

arr = ["me", "you", "us", "them"]

I want to be able to move each array element up an index when I click on it, e.g when I click on "them" the array should be like

arr = ["me", "you", "them", "us" ]

I want to use splice() in theory it seems simple but I just can't get my head around it. This is my code

    moveRowUp = (to, frm) => {
    const {layout} = this.state
    if(to >= layout.length){
        let diff = to - layout.length;
        while((diff--) + 1){
            layout.push(undefined)
        }
    }
    layout.splice(to, 0, layout.splice(to, 1)[0]);
    // this.setState({
    //     layout: layout
    // })
}

Why don't you also post the code that you tried to achieve this? — hityagi
– hityagi, Commented May 29, 2017 at 11:43
you just need a simple swap to achieve this. swap(item, item-1) — hityagi
– hityagi, Commented May 29, 2017 at 11:51

raina77ow · Accepted Answer · 2017-05-29 11:54:40Z

3

Instead of using splice, why don't you just swap two values?

function moveUp(arr, index) {
  if (index > 0) {
    _swap(arr, index, index - 1);
  }
}

function moveDown(arr, index) {
  if (index < arr.length - 1) {
    _swap(arr, index, index + 1);
  }
}

function _swap(obj, prop1, prop2) {
  var tmp = obj[prop1];
  obj[prop1] = obj[prop2];
  obj[prop2] = tmp;
}

edited May 29, 2017 at 11:54

answered May 29, 2017 at 11:47

raina77ow

107k16 gold badges205 silver badges240 bronze badges

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

Comments

Diego · Accepted Answer · 2017-05-29 11:48:56Z

1

That would be my approach using splice.

const words = ['first', 'second', 'third'];

function click(i) {
  if (i < words.length)
    words.splice(i+1, 0, words.splice(i, 1).pop());
}

click(1);
console.log(words);

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

answered May 29, 2017 at 11:48

Diego

8167 silver badges17 bronze badges

Comments

Egor Stambakio · Accepted Answer · 2017-05-29 11:56:57Z

0

Example:

const a = ["me", "you", "us", "them"];

const moveLeft = arr => word => {
  const i = arr.indexOf(word);
  if (i > -1) {
    arr.splice(i, 1); 
    arr.splice((i !== 0) ? i-1 : arr.length, 0, word) // handle 0 index
  }
  return a;
}

console.log(moveLeft(a)('them'))

answered May 29, 2017 at 11:56

Egor Stambakio

18.2k5 gold badges37 silver badges35 bronze badges

Collectives™ on Stack Overflow

How can I manually sort (move) array elements around, in react and/or javascript?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related