>  기사  >  웹 프론트엔드  >  JavaScript의 배열 정렬이 변경되지 않는 문제 해결

JavaScript의 배열 정렬이 변경되지 않는 문제 해결

hzc
hzc앞으로
2020-06-15 09:28:163429검색

JavaScript의 배열 정렬이 변경되지 않는 문제 해결

저는 최근에 프로젝트를 진행하고 있습니다. Ajax가 백그라운드에서 데이터를 반환한 후 프론트 엔드가 js로 처리되면 정렬을 어떻게 사용해도 결국에는 아무 것도 없다는 것을 알게 됩니다. 변경하거나 마지막 정렬만 변경되는 것인지 오랫동안 고민했습니다. 드디어 정보를 확인해보니 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]);
    }
}

얕은 복사, 전체 복사 및 할당

이 세 가지의 차이점은 데이터가 변경되는 방식에만 국한되지 않습니다. 간단하고 명확하게 설명하려면 표를 사용하여 가장 빠르게 이해하세요.

원본 데이터가 함께 변경되지 않습니다
    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);
JS Tutorial

동일한 객체를 가리키는가 첫 번째 레이어는 기본 데이터 유형입니다 원본 데이터에 하위 객체가 포함되어 있습니다
할당 으로 인해 원본 데이터가 함께 변경 원본을 만듭니다. 데이터가 함께 변경됩니다. 예
아니요 원본 데이터가 함께 변경됩니다 Solution
이제 원리를 알았으니 여기서 요구 사항은 모든 것을 변경하는 것입니다. 이를 처리하기 위해 JQuery의 확장 메소드를 사용할 수 있습니다:Syntax: $.extend(target, [object1], [objectN]) 여기서 target은 대상 유형을 사용하거나 { }, 이는 실제 상황에 따라 처리될 수 있습니다. 다음 [object1], [objectN]에서 우리는 확장이 여러 객체를 병합하여 대상 유형의 객체로 처리할 수 있음을 알 수 있습니다. 추천 튜토리얼: ""

위 내용은 JavaScript의 배열 정렬이 변경되지 않는 문제 해결의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 juejin.cn에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제