如何将connections对象中当前用户的键值对移至首位？

首先明确：JavaScript中的普通键值对对象没有“索引0”的概念，它本质是无序集合（ES6+虽对字符串键有插入顺序规则，但无法直接通过“索引”调整键的位置），所以你没法直接把this.connections[this.username]这个键值对移到所谓的“索引0”位置。

针对你的需求，推荐两种可行方案：

方案1：将对象转换为数组处理（不修改原对象） #

保留原connections对象结构，在渲染用户列表前，把对象转换为键值对数组，再将当前用户的项移到数组头部，渲染时遍历这个处理后的数组即可：

// 把connections对象转为键值对数组 [username, data]
let connectionsList = Object.entries(this.connections);

// 提取当前用户的项并从数组中移除
const currentUserItem = connectionsList.find(item => item[0] === this.username);
if (currentUserItem) {
  connectionsList = connectionsList.filter(item => item[0] !== this.username);
  // 把当前用户项放到数组最前面
  connectionsList.unshift(currentUserItem);
}

// 后续渲染用户列表时，遍历connectionsList即可

这种方式不需要修改原connections对象，避免了直接删除键值对可能引发的同步问题，也能保证当前用户始终在列表顶部。

方案2：改用数组存储用户数据（更适合有序场景） #

如果你的业务场景需要频繁维护用户顺序，不如直接把connections改成数组结构，这样可以直接用熟悉的数组操作调整位置：

// 重新定义数据结构为数组
connections: Array<{ username: string, data: Array<string> }> = [];

// 将当前用户移到列表顶部
const currentUserIndex = this.connections.findIndex(item => item.username === this.username);
if (currentUserIndex !== -1) {
  // 从原位置移除当前用户
  const [currentUser] = this.connections.splice(currentUserIndex, 1);
  // 插入到数组开头
  this.connections.unshift(currentUser);
}

数组本身是有序集合，这种方式更直观，后续调整顺序的操作也更简单。

之前你用delete this.connections[this.username]再单独处理引发bug，大概率是因为原对象的引用关系或渲染逻辑没有同步更新导致的，上述两种方案都能规避这类问题。

内容的提问来源于stack exchange，提问作者I. Eduard