React中如何将指定对象转换为含新键的逆序数组？

首先你原代码存在明显问题：用Object.values()拿到的是对象里的数值（比如14、0这类数字），数字类型并没有charAt()方法，运行时会直接报错，而且你也没拿到键名，根本没法提取note的序号。

给你两种可靠的实现方式，都能兼容单/多位数的note序号（比如note_10这类格式也能正常处理）：

方法一：Object.entries()+字符串分割 #

let distribution = [];

const data = props.distribution();
if (data) {
  // 1. 将对象转换为[key, value]格式的键值对数组
  distribution = Object.entries(data)
    // 2. 处理每个键值对，提取note序号并转为数字类型
    .map(([key, count]) => {
      const note = Number(key.split('_')[1]);
      return { note, count };
    })
    // 3. 按note值从大到小排序，实现逆序要求
    .sort((a, b) => b.note - a.note);
}

方法二：正则提取序号（适配性更强） #

如果后续键名格式有变化（比如改成note1、n_5），正则的适配性会更好：

let distribution = [];

const data = props.distribution();
if (data) {
  distribution = Object.entries(data)
    .map(([key, count]) => {
      // 匹配键名中的数字部分
      const noteMatch = key.match(/\d+/);
      const note = noteMatch ? Number(noteMatch[0]) : 0;
      return { note, count };
    })
    .sort((a, b) => b.note - a.note);
}

为什么不推荐charAt()？ #

charAt()只能取键名的最后一个字符，要是note序号是多位数（比如note_10），就只能拿到0，完全不符合预期。上面两种方法都能处理任意长度的数字序号，健壮性更强。

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