为什么 TypeScript 数组排序没有正确排序答案

【问题标题】：Why TypeScript Array sort is not sorting correctly为什么 TypeScript 数组排序没有正确排序
【发布时间】：2020-09-28 12:19:37
【问题描述】：

我有一个包含 54 个元素的数组。我想按它的 transactionAmount 对其进行排序。以下是代码和 console.log 输出：-

sortData(sort: Sort) {
const data = this.dataSource.filteredData;
console.log('Before sort');
this.logAll(this.dataSource.filteredData as TransactionSearch[]);
(data as TransactionSearch[]).sort((left, right) => {
// (this.dataSource.filteredData as TransactionSearch[]).sort((left, right) => {
  const isAsc = sort.direction === 'asc';
  switch (sort.active) {
    case 'currency':
      return this.compareTransactionRow(left.currency, right.currency, isAsc);
    case 'processingState':
      return this.compareTransactionRow(left.processingState, right.processingState, isAsc);
    case 'transactionAmount':
      return this.compareTransactionRow(left.transactionAmount, right.transactionAmount, isAsc);
    case 'messageFunction':
      return this.compareTransactionRow(left.messageFunction, right.messageFunction, isAsc);
    case 'transactionDate':
      return this.compareTransactionRow(left.transactionDate, right.transactionDate, isAsc);
    default: return 0;
  }
});
this.dataSource.filteredData = data;
console.log('After sort');
this.logAll(this.dataSource.filteredData as TransactionSearch[]);
 }

 compareTransactionRow(left: string | Date, right: string | Date, isAsc: boolean) {
let result = 0;
if ( left < right ) {
  result = -1;
} else if ( left > right) {
  result = 1;
}
result = result * (isAsc ? 1 : -1);
return result;
}

 logAll(data: TransactionSearch[]) {
let i = 0;
// tslint:disable-next-line:no-shadowed-variable
data.forEach( element => {
    console.log('Element: ' + i.toString());
    // console.log(element);
    console.log('element.transactionAmount: ' + element.transactionAmount);
    i++;
  }
);
}

这是一个包含 54 个元素的巨大数组。所以在排序 console.log() 之前：

 Element: 0
 element.transactionAmount: 30.00
 Element: 1
 element.transactionAmount: 100.00
 Element: 2
 element.transactionAmount: 1.00
 Element: 3
 element.transactionAmount: 3.00
 Element: 4
 element.transactionAmount: 3.00
 Element: 5
 element.transactionAmount: 1.00
 Element: 6
 element.transactionAmount: 2.00
 Element: 7
 element.transactionAmount: 2.00
 Element: 8
 element.transactionAmount: 10.00
 Element: 9
 element.transactionAmount: 10.00
 Element: 10
 element.transactionAmount: 10.00
 Element: 11
 element.transactionAmount: 10.00
 Element: 12
 element.transactionAmount: 12.00
 Element: 13
 element.transactionAmount: 12.00
 Element: 14
 element.transactionAmount: 10.00
 Element: 15
 element.transactionAmount: 10.00
 Element: 16
 element.transactionAmount: 10.00
 Element: 17
 element.transactionAmount: 1.00
 Element: 18
 element.transactionAmount: 10.00
 Element: 19
 element.transactionAmount: 100.00
 Element: 20
 element.transactionAmount: 100.00
 Element: 21
 element.transactionAmount: 100.00
 Element: 22
 element.transactionAmount: 100.00
 Element: 23
 element.transactionAmount: 10.00
 Element: 24
 element.transactionAmount: 100.00
 Element: 25
 element.transactionAmount: 1.00
 Element: 26
 element.transactionAmount: 2.00
 Element: 27
 element.transactionAmount: 100.00
 Element: 28
 element.transactionAmount: 2.00
 Element: 29
 element.transactionAmount: 2.00
 Element: 30
 element.transactionAmount: 2.00
 Element: 31
 element.transactionAmount: 10.00
 Element: 32
 element.transactionAmount: 10.00
 Element: 33
 element.transactionAmount: 100.00
 Element: 34
 element.transactionAmount: 100.00
 Element: 35
 element.transactionAmount: 100.00
 Element: 36
 element.transactionAmount: 100.00
 Element: 37
 element.transactionAmount: 50.00
 Element: 38
 element.transactionAmount: 50.00
 Element: 39
 element.transactionAmount: 50.00
 Element: 40
 element.transactionAmount: 50.00
 Element: 41
 element.transactionAmount: 100.00
 Element: 42
 element.transactionAmount: 10.00
 Element: 43
 element.transactionAmount: 100.00
 Element: 44
 element.transactionAmount: 100.00
 Element: 45
 element.transactionAmount: 10.00
 Element: 46
 element.transactionAmount: 30.00
 Element: 47
 element.transactionAmount: 100.00
 Element: 48
 element.transactionAmount: 1.00
 Element: 49
 element.transactionAmount: 1.00
 Element: 50
 element.transactionAmount: 10.00
 Element: 51
 element.transactionAmount: 10.00
 Element: 52
 element.transactionAmount: 10.00
 Element: 53
 element.transactionAmount: 10.00

排序后如下：-

 Element: 0
 element.transactionAmount: 1.00
 Element: 1
 element.transactionAmount: 1.00
 Element: 2
 element.transactionAmount: 1.00
 Element: 3
 element.transactionAmount: 1.00
 Element: 4
 element.transactionAmount: 1.00
 Element: 5
 element.transactionAmount: 1.00
 Element: 6
 element.transactionAmount: 10.00
 Element: 7
 element.transactionAmount: 10.00
 Element: 8
 element.transactionAmount: 10.00
 Element: 9
 element.transactionAmount: 10.00
 Element: 10
 element.transactionAmount: 10.00
 Element: 11
 element.transactionAmount: 10.00
 Element: 12
 element.transactionAmount: 10.00
 Element: 13
 element.transactionAmount: 10.00
 Element: 14
 element.transactionAmount: 10.00
 Element: 15
 element.transactionAmount: 10.00
 Element: 16
 element.transactionAmount: 10.00
 Element: 17
 element.transactionAmount: 10.00
 Element: 18
 element.transactionAmount: 10.00
 Element: 19
 element.transactionAmount: 10.00
 Element: 20
 element.transactionAmount: 10.00
 Element: 21
 element.transactionAmount: 10.00
 Element: 22
 element.transactionAmount: 10.00
 Element: 23
 element.transactionAmount: 100.00
 Element: 24
 element.transactionAmount: 100.00
 Element: 25
 element.transactionAmount: 100.00
 Element: 26
 element.transactionAmount: 100.00
 Element: 27
 element.transactionAmount: 100.00
 Element: 28
 element.transactionAmount: 100.00
 Element: 29
 element.transactionAmount: 100.00
 Element: 30
 element.transactionAmount: 100.00
 Element: 31
 element.transactionAmount: 100.00
 Element: 32
 element.transactionAmount: 100.00
 Element: 33
 element.transactionAmount: 100.00
 Element: 34
 element.transactionAmount: 100.00
 Element: 35
 element.transactionAmount: 100.00
 Element: 36
 element.transactionAmount: 100.00
 Element: 37
 element.transactionAmount: 100.00
 Element: 38
 element.transactionAmount: 12.00
 Element: 39
 element.transactionAmount: 12.00
 Element: 40
 element.transactionAmount: 2.00
 Element: 41
 element.transactionAmount: 2.00
 Element: 42
 element.transactionAmount: 2.00
 Element: 43
 element.transactionAmount: 2.00
 Element: 44
 element.transactionAmount: 2.00
 Element: 45
 element.transactionAmount: 2.00
 Element: 46
 element.transactionAmount: 3.00
 Element: 47
 element.transactionAmount: 3.00
 Element: 48
 element.transactionAmount: 30.00
 Element: 49
 element.transactionAmount: 30.00
 Element: 50
 element.transactionAmount: 50.00
 Element: 51
 element.transactionAmount: 50.00
 Element: 52
 element.transactionAmount: 50.00
 Element: 53
 element.transactionAmount: 50.00

如您所见，它已正确排序。这种排序有什么问题。

【问题讨论】：

How to sort an array of integers correctly
嗯，它不仅仅是一个整数数组。我有一个可以按所有元素排序的界面。这个例子我只展示了按交易金额排序。但用户可以在界面中按日期或其他元素进行排序。但是基本的排序应该简单且有效。但它不起作用。
您可以在compareTransactionRow 中检查类型left 和right 参数，并根据类型执行不同类型的排序
因为他们是string 而不是numbers
这能回答你的问题吗？ Sort Array Elements (string with numbers), natural sort

标签： javascript typescript sorting

【解决方案1】：

因为您将值比较为string 而不是numbers，所以您可以解析这些值：

 compareTransactionRow(left: string | Date, right: string | Date, isAsc: boolean) {
   let result = 0;
   if (typeof left === "string" && typeof right === "string") {
     left = parseFloat(left);
     right = parseFloat(right);
   } 
   if ( left < right ) {
     result = -1;
   } else if ( left > right) {
     result = 1;
   }
   result = result * (isAsc ? 1 : -1);
   return result;
  }

【讨论】：

数字字符串的排序有很多重复。无需全部回答。