Cross-browser Javascript array. Sort ()

However, a problem was found in the Chrome browser during a cross-browser test. The tester found that (see figure 1), when sorting by a column in chrome, if the sorting values of the two rows are the same, chrome will not change the order of the two columns as usual, but will change them in order. After a Google question, we found that the original ecmascript specification did not specify the specific sort Algorithm As a result, each browser has its own sort algorithm. However, some vendors implement this algorithm based on unstable sorting algorithms, for example, the sorting algorithms before chrome and Mozilla/Firefox 3.0 are unstable, but IE is a stable sorting algorithm. The differences in the implementation of this algorithm also result in inconsistent results of charts displayed in different browsers.

Figure 1: The number on the left of the array indicates the order of initialization.

After thinking about it, I and another member in the Group gave their own solutions. His opinion is to implement specific sort algorithms to achieve unified control, since there are many existing sorting algorithms on the Internet and the Sorting Algorithm isProgramIt is not complicated to implement this approach. The only task isCode. However, I think there is actually a simpler method, because our data is parsed from XML based on XSLT, XSLT knows the serial number of each row of data (of course, it is easy to obtain this value if the server-side code reads data from the database or WebService ), so I think you can add an index attribute for each column in XSLT, e.g. the first row Index = 1, the second row Index = 2... in this way, if two values are the same when sort is compared, the row number is compared. In this way, you only need to add two lines of code to the comparison function. The following is the implementation code and result:

Copy code The Code is as follows: var array = [
{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 ){
// If the two values are the same, they are compared based on the row number (index value during initialization.
Return A. Index-B. index;
}
Return A. Val-B. Val;
})
For (VAR I = 0; I <array. length; I ++ ){
Document. Write ("<p>" + array [I]. index + ":" + array [I]. Val + "</P> ");
}

Updated results:

Of course, this is only one of the solutions. My goal is to minimize the amount of code we need to maintain, so as to minimize bugs. I hope it will be helpful to you.

Frustration is like a wall that forces us to prove to ourselves how eager we are to get the treasure behind it