js中的数组对象排序

😲 js中的数组对象排序

MDN : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
sort() 方法用原地算法对数组的元素进行排序，并返回数组。默认排序顺序是在将元素转换为字符串，然后比较它们的 UTF-16 代码单元值序列时构建的

描述
如果没有指明 compareFn ，那么元素会按照转换为的字符串的诸个字符的 Unicode 位点进行排序。例如 "Banana" 会被排列到 "cherry" 之前。当数字按由小到大排序时，9 出现在 80 之前，但因为（没有指明 compareFn），比较的数字会先被转换为字符串，所以在 Unicode 顺序上 "80" 要比 "9" 要靠前。

如果指明了 compareFn ，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：
如果 compareFn(a, b) 大于 0，b 会被排列到 a 之前。
如果 compareFn(a, b) 小于 0，那么 a 会被排列到 b 之前；
如果 compareFn(a, b) 等于 0，a 和 b 的相对位置不变。备注：ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）；
compareFn(a, b) 必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。

语法：
// 无函数
sort()

// 箭头函数
sort((a, b) => { /* … */ } )

// 比较函数
sort(compareFn)

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

参数
compareFn 可选
用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的 Unicode 位点进行排序。

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

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

返回值
排序后的数组。请注意，数组已原地排序，并且不进行复制。

compareFn(a, b) 返回值	排序顺序
> 0	a 在 b 后 (升序)
< 0	a 在 b 前（降序）
=== 0	保持 a 和 b 的顺序

1、数组对象排序

// 数组对象排序
const compare = function (obj1, obj2) {
  let val1 = obj1.id;  // 根据 id 比较
  let val2 = obj2.id;
  if (val1 < val2) {
    return 1;
  } else if (val1 > val2) {
    return -1;
  } else {
    return 0;
  }
}

 <div className="main-content">
              {/*博客内容*/}
              {
                // 排序返回的数组 进行 map 遍历
                articleList.sort(compare).map((item,index)=>{
                  // console.log(item.id)
                  return (
                    index % 2 === 1 ? <ArticleItem item={item} key={item.id}/>:<ArticleItemRight item={item} key={item.id}/>
                  )
                })
              }
 </div>