如何将匹配条件的元素移至JavaScript数组首位？

嘿，这需求挺常见的，我给你两种实用的解决方案，看哪种更贴合你的场景：

方法一：通用简洁版（支持多个匹配元素） #

这种方法通过拆分数组来实现，能保证所有匹配元素（不管有几个）都移到前面，同时匹配元素之间、不匹配元素之间都严格保持原有顺序：

var data = [
 { id: "fmgbwe45", age: 24, gender: "male" },
 { id: "kjregh23", age: 27, gender: "female" },
 { id: "kjfdhg87", age: 30, gender: "male" },
 { id: "lsdjfk43", age: 10, gender: "female" },
];

// 先定义你的匹配规则，这里对应示例里的"年龄30且性别男"
const shouldMoveToTop = item => item.age === 30 && item.gender === "male";

// 拆分并重组数组
const adjustedData = [
  // 第一部分：所有匹配规则的元素（保持原顺序）
  ...data.filter(shouldMoveToTop),
  // 第二部分：所有不匹配的元素（保持原顺序）
  ...data.filter(item => !shouldMoveToTop(item))
];

console.log(adjustedData);
// 输出就是你想要的结果

方法二：针对单个匹配元素的高效版 #

如果确定只有一个元素会匹配规则，用这种方法更高效，直接操作原数组（也可以复制后操作避免修改原数据）：

var data = [
 { id: "fmgbwe45", age: 24, gender: "male" },
 { id: "kjregh23", age: 27, gender: "female" },
 { id: "kjfdhg87", age: 30, gender: "male" },
 { id: "lsdjfk43", age: 10, gender: "female" },
];

const shouldMoveToTop = item => item.age === 30 && item.gender === "male";
const matchIndex = data.findIndex(shouldMoveToTop);

// 找到匹配元素后，把它移到数组开头
if (matchIndex !== -1) {
  // splice移除元素并返回，unshift加到开头
  const matchedItem = data.splice(matchIndex, 1)[0];
  data.unshift(matchedItem);
}

console.log(data);
// 同样得到目标输出

小提示 #

• 两种方法都不会破坏原数组的元素结构，只是调整顺序；
• 方法一的优势是逻辑清晰，不管有多少个匹配元素都能正确处理；
• 方法二更适合确定只有一个匹配项的场景，性能略优（少一次遍历）。

内容的提问来源于stack exchange，提问作者Mr world wide