寻求可控制项顺序且保证属性唯一的JavaScript数据结构

你需要的是同时兼顾有序性和指定属性唯一性的数据结构，以下几种简洁实现方式可以直接用：

1. 封装自定义集合类（推荐，功能完整） #

自己封装一个类，内部用Map保证属性唯一，用数组维护顺序，把增删改移的逻辑都封装好，用起来很方便：

class OrderedUniqueCollection {
  constructor(uniqueKey = 'id') {
    this.uniqueKey = uniqueKey; // 指定唯一标识属性，默认是id
    this._map = new Map(); // 存属性值到对象的映射，确保唯一性
    this._order = []; // 存属性值的顺序，控制整体排序
  }

  // 添加/更新元素：重复属性会覆盖旧值，顺序不变
  add(item) {
    const key = item[this.uniqueKey];
    if (!this._map.has(key)) {
      this._order.push(key);
    }
    this._map.set(key, item);
  }

  // 删除元素
  remove(key) {
    this._map.delete(key);
    this._order = this._order.filter(k => k !== key);
  }

  // 调整元素位置
  move(key, newIndex) {
    const currentIndex = this._order.indexOf(key);
    if (currentIndex === -1 || newIndex < 0 || newIndex >= this._order.length) return;
    this._order.splice(currentIndex, 1);
    this._order.splice(newIndex, 0, key);
  }

  // 获取有序的元素数组
  get items() {
    return this._order.map(key => this._map.get(key));
  }
}

用法示例 #

const coll = new OrderedUniqueCollection();
coll.add({ id: 1, name: "James" });
coll.add({ id: 2, name: "John" });
coll.add({ id: 1, name: "James Updated" }); // 重复id，自动覆盖旧值
console.log(coll.items);
// 输出: [{id:1, name:"James Updated"}, {id:2, name:"John"}]

coll.move(2, 0); // 把id=2的元素移到首位
console.log(coll.items);
// 输出: [{id:2, name:"John"}, {id:1, name:"James Updated"}]

2. 用Map实现（轻量，适合仅需插入顺序的场景） #

ES6的Map本身就是按插入顺序存储，且键唯一的结构。如果不需要手动调整顺序，直接用它就够了：

const stuffMap = new Map();
// 添加元素，重复键会覆盖旧值
stuffMap.set(1, { id: 1, name: "James" });
stuffMap.set(2, { id: 2, name: "John" });
stuffMap.set(1, { id: 1, name: "James Updated" });

// 转成有序数组
const orderedItems = Array.from(stuffMap.values());
console.log(orderedItems);
// 输出: [{id:1, name:"James Updated"}, {id:2, name:"John"}]

3. 数组+工具函数（极简，适合简单场景） #

如果不想引入新结构，直接给数组加个检查逻辑，保证属性唯一：

// 添加元素时检查唯一性，重复则覆盖，否则追加
function addUniqueItem(arr, item, uniqueKey = 'id') {
  const existingIdx = arr.findIndex(i => i[uniqueKey] === item[uniqueKey]);
  if (existingIdx !== -1) {
    arr[existingIdx] = item;
    // 也可以改成抛出错误：throw new Error(`已存在${uniqueKey}=${item[uniqueKey]}的元素`)
  } else {
    arr.push(item);
  }
}

// 用法
const stuff = [{ id: 1, name: "James" }, { id: 2, name: "John" }];
addUniqueItem(stuff, { id: 1, name: "James Updated" });
console.log(stuff);
// 输出: [{id:1, name:"James Updated"}, {id:2, name:"John"}]

// 顺序调整直接用数组的splice方法即可
stuff.splice(0, 0, stuff.splice(1, 1)[0]); // 交换两个元素位置

内容的提问来源于stack exchange，提问作者Evanss