js中 sort 方法的使用 和 底层实现原理

语法

arr.sort([compareFunction])

参数

在JavaScript中 方括号 里的内容是可选的，可就是compareFunction这个参数是可填可不填的。 compareFunction 是一个函数,用来指定按某种顺序进行排列的函数。 如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。 例子如下： 在数组中的值为number类型时，结果并不是和正常排序一样，而是字符编码的出现顺序排列的。

var arr = [2, 6, 8, 8, 2, 10]
console.log(arr.sort())  //[ 10, 2, 2, 6, 8, 8 ]

compareFunction 函数中接受两个参数,并有返回值：

firstEl第一个用于比较的元素。 secondEl第二个用于比较的元素。 返回值排序后的数组。请注意，数组已原地排序，并且不进行复制（返回的是原数组，并不是创建的新数组）。

如果指明了 compareFunction，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：

如果 a-b>0 ,看成是升序排列 ,从小到大排序； 如果 a-b=0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所 有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）； 如果a-b<0 ,看成是降序排列，从大到小排序 。

升序排列

var arr = [2, 6, 8, 8, 2, 10]
console.log(
  arr.sort(function (a, b) {
          
   
    return a - b
  })
)    //[ 2, 2, 6, 8, 8, 10 ]

降序排列

var arr = [2, 6, 8, 8, 2, 10]
console.log(
  arr.sort(function (a, b) {
          
   
    return b-a
  })   //[ 10, 8, 8, 6, 2, 2 ]

按照数组对象的某个属性排序： 那么在现实比较中，会有更复杂的比较存在，例如：在数组对象中按照某个元素的属性值排列， 在很大的一张表中，按照特定的属性要求排序，那么怎么实现呢？ 直接上例子：

var data = [{
          
    name: Zachary, age: 18 }, {
          
    name: Nicholas, age: 19 }]

function ComparisonFunction(typename) {
          
   
  // console.log(arguments.callee)
  return function (ob1, ob2) {
          
   
    var value1 = ob1[typename]
    var value2 = ob2[typename]
    // console.log(ob1)
    if (value1 < value2) {
          
   
      return -1
    } else if (value1 > value2) {
          
   
      return 1
    } else {
          
   
      return 0
    }
  }
}
// 按照姓名排序:[ { name: Nicholas, age: 19 }, { name: Zachary, age: 18 } ]
console.log(data.sort(ComparisonFunction(name)))  
// 按照年龄排序 [ { name: Zachary, age: 18 }, { name: Nicholas, age: 19 } ]
console.log(data.sort(ComparisonFunction(age)))

实现原理

在看完上述的代码，是否有一定的疑惑？为什么通过一个函数就能实现对数组的排序。那么代码是怎么做到的？ 我们用原生的js来实现一下这些功能。

function sort(arr, fn) {
          
   
  for (var i = 0; i < arr.length - 1; i++) {
          
   
    for (var j = 0; j < arr.length - 1 - i; j++) {
          
   
      if (fn(arr[j], arr[j + 1]) > 0) {
          
   
        var temp = arr[j]
        arr[j] = arr[j + 1]
        arr[j + 1] = temp
      }
    }
  }
  return arr
}
var arr = [6, 64, 5, 1, 8]

console.log(
	// 形参，传递函数
  sort(arr, function (a, b) {
          
   
    return b - a 
  })
)  // [ 64, 8, 6, 5, 1 ]

compareFunction是如何通过两个参数进行比较的呢。 答案就是传递的a和b在函数内部进行了冒泡排序，通过两个相邻的元素进行比较，最终将比较完的数组在返回给方法。 在查看js源码后，V8 引擎 sort 函数只给出了两种排序 InsertionSort 和 QuickSort，数量小于10的数组使用 InsertionSort，比10大的数组则使用 QuickSort。 欢迎指导错误！