web-dev-qa-db-fra.com

Array Reverse ne fonctionne pas pour moi ...

Considérez le code suivant (code React JS):

  poll() {
    var self   = this;
    var url    = "//" + location.hostname + "/api/v1/eve/history/historical-data/" + this.state.itemId + '/' + this.state.regionId + '/40';

    $.get(url, function(result) {
      console.log(result.data, result.data.reverse());
      self.setState({
        error:          null,
        historicalData: result.data.reverse(),
        isLoading: false
      });
    }).fail(function(response) {
      self.setState({
        error: 'Could not fetch average price data. Looks like something went wrong.',
      });
    });
  }

Notez le console.log. Voyons une image:

enter image description here

La dernière fois que j'ai vérifié, l'inverse aurait dû inverser l'ordre du tableau. Pourtant, ce n'est pas le cas.

Suis-je en utilisant ce mauvais (documents officiels MDN) ? Pourquoi l'inverse ne fonctionne-t-il pas?

12
TheWebs

Comme décrit sur https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse , reverse() inverse l'ordre d'un tableau en place , donc le tableau est inversé après avoir été appelé. Vous l'appelez deux fois, ce qui entraîne la restauration de la matrice dans son ordre d'origine. Essaye ça:

poll() {
    var self   = this;
    var url    = "//" + location.hostname + "/api/v1/eve/history/historical-data/" + this.state.itemId + '/' + this.state.regionId + '/40';

    $.get(url, function(result) {
        result.data.reverse();
        console.log(result.data, result);
        self.setState({
            error:          null,
            historicalData: result,
            isLoading: false
        });
    }).fail(function(response) {
        self.setState({
            error: 'Could not fetch average price data. Looks like something went wrong.',
    });
}
2
AmericanUmlaut

Il l'a inversé, la reverse() est exécutée avant la console.log(). Il mute le tableau réel en premier, renvoyant une référence, puis lorsqu'il est enregistré, a est également inversé.

var a = [1,2,3,4];
console.log(a, a.reverse());
// [4, 3, 2, 1] [4, 3, 2, 1]

Tout à l'intérieur du console.log parens est évalué en premier. Essayez 2 revers, pouvez-vous deviner ce qui se passe, cela revient à l'ordre d'origine, comme dans votre exemple.

var a = [1,2,3,4]
console.log(a, a.reverse(), a.reverse());
// [1, 2, 3, 4] [1, 2, 3, 4] [1, 2, 3, 4]
11
Matt Harrison

La source de votre problème est que vous ne comprenez pas comment fonctionne la console de votre navigateur.

De nombreux navigateurs ont des consoles qui affichent les objets dans l'état où ils se trouvent lorsque vous les développez dans la console ou lorsque vous ouvrez la console, même s'ils changent après l'appel de console.log(). Donc si vous le faites:

console.log(result.data);
result.data.reverse();
console.log(result.data);

vous verrez deux fois la même sortie. La deuxième ligne inverse le tableau en place, donc les deux sorties de journal affichent le même tableau, dans son état actuel.

Pour illustrer ce comportement de console, vous pouvez effectuer les opérations suivantes:

var b = { a: [1, 2, 3] };
console.log(b);
b.a[1] = 9;
console.log(b);

ce que vous verrez, c'est que b.a est [1, 9, 3] dans les deux sorties de la console.

2
JLRishe

si vous avez une propriété triable dans votre tableau d'objets, 'sort' fera le réarrangement après avoir poussé un élément dans les éléments

dire,

let items = [{id: 1, color: 'blue'}, {id: 2, color: 'red'}];
let item = {id: 10, color: 'green'};
items.Push(item);

items.sort((a, b)=>{
    return b.id - a.id  //this will sort according to .id descending
});
0
Joseph Ocampo