Résolvez le problème selon lequel le tri des tableaux en JavaScript ne change pas

Je travaillais récemment sur un projet après qu'Ajax ait renvoyé des données en arrière-plan, lorsque le front-end était traité avec js, j'ai découvert que peu importe comment. sort a été utilisé, il n'y aurait aucun changement à la fin.Ou changer seulement le dernier tri.Après avoir longtemps lutté, j'ai finalement vérifié les informations et découvert qu'il y avait une distinction entre la copie superficielle et la copie profonde dans js.

    var provinceConfirmedCount = data;
    var provinceDeadCount = data;
    var provinceCuredCount = data;

    provinceConfirmedCount.sort(sortBy(("provinceConfirmedCount")));
    provinceDeadCount.sort(sortBy(("provinceDeadCount")));
    provinceCuredCount.sort(sortBy(("provinceCuredCount")));

    console.log(provinceConfirmedCount); //不生效
    console.log(provinceDeadCount); //不生效
    console.log(provinceCuredCount); //生效

//比较数组对象
function sortBy(field) {
    return function(a,b) {
        return parseInt(b[field]) - parseInt(a[field]);
    }
}

Copie superficielle, copie approfondie et affectation

La différence entre ces trois réside dans la manière de modifier les données, par souci de simplicité. Clairement , utilisez un tableau pour comprendre le plus rapidement :

	是否指向同一对象	第一层为基本数据类型	原数据中包含子对象
赋值	是	会使原数据一同改变	会使原数据一同改变
浅拷贝	否	不会使原数据一同改变	会使原数据一同改变
深拷贝	是	不会使原数据一同改变	不会使原数据一同改变

Qu'il pointe vers le même objet

La première couche est le type de données de base

Les données d'origine contiennent des sous-objets

Devoir

Oui

modifiera les données d'origine ensemble

entraînera une modification simultanée des données d'origine

Copie superficielle

Non

Les données originales ne seront pas modifiées

modifiera les données d'origine

Copie complète

Oui

ne modifiera pas les données d'origine

Les données originales ne seront pas modifiées en même temps

Solution

Maintenant que vous connaissez le principe, voici L'exigence nécessite toutes les modifications, nous pouvons donc utiliser la méthode extend dans JQuery pour la gérer :

    var provinceConfirmedCount = $.extend([], data);
    var provinceDeadCount = $.extend([], data);;
    var provinceCuredCount = $.extend([], data);;

    provinceConfirmedCount.sort(sortBy(("provinceConfirmedCount")));
    provinceDeadCount.sort(sortBy(("provinceDeadCount")));
    provinceCuredCount.sort(sortBy(("provinceCuredCount")));

    console.log(provinceConfirmedCount);
    console.log(provinceDeadCount);
    console.log(provinceCuredCount);

Syntaxe : $.extend( target, [object1], [objectN] ) où target est le type de cible, ici I Le tableau [] est utilisé, et il peut également être {}, qui peut être traité en fonction de la situation réelle. À partir des [object1], [objectN] suivants, nous pouvons savoir que extend peut fusionner plusieurs objets à traiter en un objet du type cible. Tutoriel recommandé : "Tutoriel JS"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!