JS 前端排序 数组指定项移动到最后

Posted 2021-08-17 码小余の博客

JS 前端排序 数组指定项移动到最后

问题来源：模仿win10文件夹中按类型排序
文件夹在上，文件在下，并且点击按类型排序后，文件夹和文件会各自按首字母进行排序

/**
 * 数组指定元素移动到最后的位置
 * @param {*} arr 需要排序的数组
 * @param {*} sourceIndex 需要移动的元素的索引
 * @param {*} targetIndex 目标索引
 */
function moveArray(arr, sourceIndex, targetIndex) {
  // splice 将目标元素替换并将原结果扔回来赋值给它
  arr[sourceIndex] = arr.splice(targetIndex, 1, arr[sourceIndex])[0];
}

var arr = [
  {
    id: 0,
    name: "Rose",
    type: "dircetory",
  },
  {
    id: 1,
    name: "Robin",
    type: "file",
  },
  {
    id: 2,
    name: "Tom",
    type: "dircetory",
  },
  {
    id: 3,
    name: "Taide",
    type: "file",
  },
  {
    id: 4,
    name: "Danni",
    type: "dircetory",
  },
];

// 索引数组(需要移动的元素索引数组)
var sourceIndexes = [];
arr.forEach((item, index) => {
  if (item.type == "file") {
    sourceIndexes.push(index);
  }
});

// 遍历索引数组，移动元素
sourceIndexes.forEach((sourceIndex) => {
  moveArray(arr, sourceIndex, arr.length);
});

// 过滤数组，去除 undefined 项
var result = arr.filter((item) => {
  return item !== undefined || !!item;
});
console.log(result);

输出结果

[
  { id: 0, name: 'Rose', type: 'dircetory' },
  { id: 2, name: 'Tom', type: 'dircetory' },
  { id: 4, name: 'Danni', type: 'dircetory' },
  { id: 1, name: 'Robin', type: 'file' },
  { id: 3, name: 'Taide', type: 'file' }
]