Verschieben eines Array-Elements von einer Array-Position zu einer anderen

Question

Ich habe eine harte Zeit herauszufinden, wie man ein Element eines Arrays zu bewegen. Zum Beispiel, gegeben die folgenden:

var array = [ 'a', 'b', 'c', 'd', 'e'];

Wie kann ich eine Funktion schreiben, um das Element zu verschieben 'd' links von 'b' ?

O 'a' rechts von 'c' ?

Nach dem Verschieben der Elemente sollten die Indizes der übrigen Elemente aktualisiert werden. Die resultierende Anordnung wäre:

array = ['a', 'd', 'b', 'c', 'e']

Das scheint ziemlich einfach zu sein, aber ich kann es nicht begreifen.

Answer 1

Wenn Sie eine Version auf npm möchten, array-move kommt dieser Antwort am nächsten, auch wenn es sich nicht um dieselbe Implementierung handelt. Siehe den Abschnitt über die Verwendung für weitere Details. Die vorherige Version dieser Antwort (die Array.prototype.move modifiziert hat) kann auf npm gefunden werden unter array.prototype.move .

---

Ich hatte recht guten Erfolg mit dieser Funktion:

function array_move(arr, old_index, new_index) {
    if (new_index >= arr.length) {
        var k = new_index - arr.length + 1;
        while (k--) {
            arr.push(undefined);
        }
    }
    arr.splice(new_index, 0, arr.splice(old_index, 1)[0]);
    return arr; // for testing
};

// returns [2, 1, 3]
console.log(array_move([1, 2, 3], 0, 1)); 

Beachten Sie, dass die letzte return ist lediglich zu Testzwecken gedacht: splice führt die Operationen auf dem Array an Ort und Stelle aus, so dass eine Rückgabe nicht erforderlich ist. Durch die Erweiterung, die move ist eine In-Place-Operation. Wenn Sie das vermeiden und eine Kopie zurückgeben wollen, verwenden Sie slice .

Schritt für Schritt durch den Code:

1. Si new_index größer ist als die Länge des Arrays, wollen wir (so nehme ich an) das Array mit neuen undefined s. Dieses kleine Snippet behandelt dies, indem es undefined auf das Array, bis wir die richtige Länge haben.
2. Dann, in arr.splice(old_index, 1)[0] spleißen wir das alte Element heraus. splice gibt das Element zurück, das herausgespleißt wurde, aber es befindet sich in einem Array. In unserem obigen Beispiel war dies [1] . Wir nehmen also den ersten Index dieses Arrays, um den Rohwert zu erhalten 1 dort.
3. Dann verwenden wir splice um dieses Element an der Stelle von new_index einzufügen. Da wir das Array oben aufgefüllt haben, wenn new_index > arr.length wird sie wahrscheinlich an der richtigen Stelle erscheinen, es sei denn, sie haben etwas Seltsames getan, wie zum Beispiel eine negative Zahl eingegeben.

Eine ausgefeiltere Version zur Berücksichtigung negativer Indizes:

function array_move(arr, old_index, new_index) {
    while (old_index < 0) {
        old_index += arr.length;
    }
    while (new_index < 0) {
        new_index += arr.length;
    }
    if (new_index >= arr.length) {
        var k = new_index - arr.length + 1;
        while (k--) {
            arr.push(undefined);
        }
    }
    arr.splice(new_index, 0, arr.splice(old_index, 1)[0]);
    return arr; // for testing purposes
};

// returns [1, 3, 2]
console.log(array_move([1, 2, 3], -1, -2));

Dabei sollten Dinge berücksichtigt werden wie array_move([1, 2, 3], -1, -2) richtig (das letzte Element an die vorletzte Stelle verschieben). Das Ergebnis sollte dann sein [1, 3, 2] .

Wie auch immer, in Ihrer ursprünglichen Frage würden Sie Folgendes tun array_move(arr, 0, 2) para a nach c . Para d vor b würden Sie tun array_move(arr, 3, 1) .

Answer 2

Ich mag diesen Weg. Sie ist prägnant und sie funktioniert.

function arraymove(arr, fromIndex, toIndex) {
    var element = arr[fromIndex];
    arr.splice(fromIndex, 1);
    arr.splice(toIndex, 0, element);
}

Hinweis: Denken Sie immer daran, Ihre Array-Grenzen zu überprüfen.

Snippet in jsFiddle ausführen

Answer 3

Hier ist ein Einzeiler, den ich auf JSPerf.... gefunden habe

Array.prototype.move = function(from, to) {
    this.splice(to, 0, this.splice(from, 1)[0]);
};

das ist toll zu lesen, aber wenn Sie Leistung (in kleinen Datensätzen) wollen, versuchen Sie...

 Array.prototype.move2 = function(pos1, pos2) {
    // local variables
    var i, tmp;
    // cast input parameters to integers
    pos1 = parseInt(pos1, 10);
    pos2 = parseInt(pos2, 10);
    // if positions are different and inside array
    if (pos1 !== pos2 && 0 <= pos1 && pos1 <= this.length && 0 <= pos2 && pos2 <= this.length) {
      // save element from position 1
      tmp = this[pos1];
      // move element down and shift other elements up
      if (pos1 < pos2) {
        for (i = pos1; i < pos2; i++) {
          this[i] = this[i + 1];
        }
      }
      // move element up and shift other elements down
      else {
        for (i = pos1; i > pos2; i--) {
          this[i] = this[i - 1];
        }
      }
      // put element from position 1 to destination
      this[pos2] = tmp;
    }
  }

Ich kann keine Lorbeeren ernten, sie sollten alle an Richard Scarrott . Sie schlägt die auf Spleiß basierende Methode für kleinere Datensätze in diesem Leistungsprüfung . Bei größeren Datensätzen ist es jedoch deutlich langsamer wie Darwayne hervorhebt .

Answer 4

Die Methode splice() fügt Elemente zu einem Array hinzu oder entfernt sie daraus und gibt die entfernt Punkt(e).

Hinweis: Diese Methode ändert das ursprüngliche Array. /w3schools/

Array.prototype.move = function(from,to){
  this.splice(to,0,this.splice(from,1)[0]);
  return this;
};

var arr = [ 'a', 'b', 'c', 'd', 'e'];
arr.move(3,1);//["a", "d", "b", "c", "e"]

var arr = [ 'a', 'b', 'c', 'd', 'e'];
arr.move(0,2);//["b", "c", "a", "d", "e"]

da die Funktion kettbar das funktioniert auch:

alert(arr.move(0,2).join(','));

Demo hier

Answer 5

Mein 2c. Leicht zu lesen, es funktioniert, es ist schnell, es erstellt keine neuen Arrays.

function move(array, from, to) {
  if( to === from ) return array;

  var target = array[from];                         
  var increment = to < from ? -1 : 1;

  for(var k = from; k != to; k += increment){
    array[k] = array[k + increment];
  }
  array[to] = target;
  return array;
}