如何理解-JavaScript-中的sort排序

sort排序是针对数组中的元素进行升序排序。sort()使用分两种情况

• 无函数

• 有函数

#无函数

如果sort()方法中无函数，则排序是在将数组中的元素转换为字符串,然后比较元素字符串UTF-16 代码单元值序列（元素按照转换为的字符串的各个字符的 Unicode 位点进行排序。）

复制const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);

Output

复制[ 1, 100000, 21, 30, 4 ]

注意，这里不是 按照 1,4,21,30,100000顺序排列是因为不是按照number类型排序而是按照元素的字符串形式排序。所以是按照 1,1,2,3,4的顺序，如果第一位相同则比较第二位，以此类推。 所以如果是 1100,120 ,则排序结果不是按照数字排列的 120 ,1100 而是按照字符串排列 。第一位都是 1,看第二位，由于1100第二位是1,而 120第二位是2,1<2,所以 1100 应该在120前面。

#有函数

如果 sort()中有函数，则按照函数形式不同，又分为几种情况

• 箭头函数

• 比较函数

• 内联比较函数

#箭头函数

复制// 格式 

sort((a, b) => { /* … */ } )

// 例子

const arr = [1,3,2,5,6,4]

arr.sort((a,b)=>{
  return a-b
})

console.log("@",arr)

Output

复制[ 1, 2, 3, 4, 5, 6 ]

• a：第一个用于比较的元素。

• b：第二个用于比较的元素。

#关于 a,b 顺序决定排序方式的规则

• a-b：则表示升序（如上述代码例子）。a-b > 0 ,则返回正数，a 在b后，保持升序；若 a-b < 0 ，则返回负数，不改变顺序（结果为正，则升序）。这样保证排序方式是升序。

• b-a：则表示降序。b-a < 0, 则返回负数，b在a后，保持降序； 若 b-a > 0 ,则返回正数，不改变顺序（结果为负，则降序）。这样保证排序方式是降序。

#关于为什么升序是 a-b ,而降序是 b-a 的理解

• a-b ：希望前面的参数a是 < 后面的参数 b 。如果满足期望，则不改变顺序，否则调换顺序。

• b-a： 希望前面的参数a是 > 后面的参数 b。同上。

更加简化的说，排序方式是升序还是降序由 a,b 的大小顺序相反的顺序 决定，默认 a 在前，b在后。

• 保证升序，只需要a,b呈现降序（a大,b小）的时候，将a,b交换即可保证升序。而a,b呈现降序意味着 a-b > 0 ，所以升序看a-b。【处理降序的情况】

• 保证降序，只需要a,b呈现升序（a小,b大）的时候，将a,b交换即可保证降序。而a,b呈现升序意味着 a-b < 0 （即 b-a > 0） ，所以降序看 b-a。 【处理升序的情况】

#比较函数

比较函数和内联比较函数本质一样，只不过一个将函数名作为回调，一个将函数定义（声明）作为回调。

复制// 比较函数
    
sort(compareFn) 
    
// 内联比较函数
    
sort(function compareFn(a, b) { /* … */ })

比较函数格式如下：

复制function compareFn(a, b) {
  if (在某些排序规则中，a 小于 b) {
    return -1;
  }

  if (在这一排序规则下，a 大于 b) {
    return 1;
  }

  // a 一定等于 b
  return 0;
} 

不难看出上述定义的对比函数的功能是用来升序的。可以修改逻辑改为降序的功能。

#内联比较函数

略~~~

#更多例子

排序对象中的属性

复制const items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
  { name: 'The', value: -12 },
  { name: 'Magnetic', value: 13 },
  { name: 'Zeros', value: 37 }
];

// sort by value

items.sort((a, b) => a.value - b.value);

console.log("@sort by value in ascend",items)

// sort by name

items.sort((a, b) => {

  const nameA = a.name.toUpperCase(); // ignore upper and lowercase
  const nameB = b.name.toUpperCase(); // ignore upper and lowercase

  if (nameA < nameB) {
    return -1;
  }

  if (nameA > nameB) {
    return 1;
  }

  // names must be equal

  return 0;

});

console.log("@sort by name in ascend",items)

Output

复制@sort by value in ascend [

  { name: 'The', value: -12 },

  { name: 'Magnetic', value: 13 },

  { name: 'Edward', value: 21 },

  { name: 'Sharpe', value: 37 },

  { name: 'Zeros', value: 37 },

  { name: 'And', value: 45 }

]

@sort by name in ascend [

  { name: 'And', value: 45 },

  { name: 'Edward', value: 21 },

  { name: 'Magnetic', value: 13 },

  { name: 'Sharpe', value: 37 },
  { name: 'The', value: -12 },

判断排序功能是升序，因为 a-b > 0 的情况下，a,b大小顺序是降序，说明处理的情况是降序，功能与处理情况相反是升序。

#总结

• 在参数是 a,b 顺序的情况下，无论是箭头函数还是自定义对比函数，判断（设计）升序或降序，只需要判断 a-b 的情况，如果 >0 ，则是升序，否则降序。

• 其中对于箭头函数有一个判断规则：”在参数是 a,b 顺序的情况下，函数体的结果 > 0 , a,b的大小顺序表示需要处理的情况，处理情况相反的情况就是表示该排序的功能“。