browsers_javascript 기술 전반에 걸쳐 javascript Array.sort()를 사용할 때 고려해야 할 문제

그런데 크로스 브라우저 테스트를 하던 중 Chrome 브라우저에서 문제가 발견되었습니다(그림 1 참조). Chrome에서 특정 열을 기준으로 정렬할 때 두 행의 정렬 값이 다음과 같은 경우. 마찬가지로 Chrome은 일반적인 상황을 따르지 않고 두 열의 순서를 변경하지 않고 순서를 바꿉니다. 문제를 검색한 결과 원래 ECMAscript 사양에는 특정 정렬 알고리즘이 규정되어 있지 않아 각 브라우저마다 고유한 정렬 알고리즘이 있었지만 일부 제조업체에서는 Mozilla/이전의 크롬 정렬 알고리즘과 같은 불안정한 정렬 알고리즘을 기반으로 구현한 것으로 나타났습니다. Firefox 3.0은 불안정하지만 IE는 안정적인 정렬 알고리즘입니다. 알고리즘 구현의 이러한 차이로 인해 여러 브라우저에서 차트 표시 결과가 일관되지 않게 됩니다.

                                                                                                          ~
잠시 고민한 끝에 그룹의 다른 구성원과 저는 자체 솔루션을 제시했습니다. 그의 의견은 이미 준비된 정렬 알고리즘이 많다는 점을 고려하여 자체적으로 특정 정렬 알고리즘을 구현하여 통합 제어를 달성하는 것이었습니다. 인터넷에서 만든 정렬 알고리즘은 프로그래머의 경우 이 방법을 구현하는 것이 복잡하지 않으며 유일한 작업은 코드를 구현하는 것입니다. 하지만 실제로는 더 간단한 방법이 있다고 생각합니다. 왜냐하면 우리의 데이터는 XSLT를 기반으로 xml에서 구문 분석되고 XSLT는 각 데이터 행의 일련 번호를 알고 있기 때문입니다(물론 데이터베이스나 웹 서비스에서 읽는 경우에도 동일합니다). 서버 측 코드 이 값을 쉽게 얻을 수 있으므로 XSLT의 각 열에 Index 속성을 추가할 수 있다고 생각합니다(예: 첫 번째 행에 Index=1, 두 번째 행에 Index=2...). , 크기를 비교하기 위해 정렬할 때 두 개가 발견되면 값이 동일하면 줄 번호를 비교하면 결국 비교 함수에 두 줄의 코드만 추가하면 됩니다. 다음은 구현 코드 및 결과 스크린샷입니다.

코드 복사 코드는 다음과 같습니다.

var 배열 = [

{Index:1,val:25},
{Index:2,val:25},
{Index:3,val:45},
{ Index:4,val:78 }];
array.sort(function(a, b) {
if (a.val === b.val) {
//두 값 ​​여기서는 비교를 위해 행 번호(초기화 중 인덱스 값)에 따라 다릅니다. ) {
document.write("

" array[i] .Index ":" 배열[i].val "

");
업데이트된 결과 스크린샷:






물론 이것은 해결책 중 하나일 뿐입니다. 제 목적은 유지 관리해야 하는 코드의 양을 최소화하여 버그를 최소화하는 것입니다. 아이디어가 도움이 되길 바랍니다.

좌절은 벽과 같습니다. 이 벽은 우리가 이 벽 뒤에 있는 보물을 얼마나 원하는지 스스로에게 증명하도록 강요합니다