为何JavaScript会将我的JSON按键升序重新排序？

问题本质 #

JavaScript里的普通对象，只要键是数字（或能被解析为数字的字符串），就会自动按升序排列键，这是ECMAScript的标准行为，和JSON文件里的原始顺序无关。你用JSON.parse(data)报错，是因为import语句已经把JSON文件解析成对象了，再对对象执行JSON.parse自然会报错。

解决方案：用数组保存顺序 #

要保留Python生成的随机顺序，不能用普通对象存储，改用数组存储键值对，数组会严格保留元素的顺序。

调整Python代码 #

把原本的字典转换成键值对数组，再序列化：

def generate_translation(language):
    dictionary = DICTIONARIES[language]
    words = list(dictionary.keys())
    random.shuffle(words)
    # 生成键值对数组，替代原字典
    test_list = [{"key": key, "value": dictionary[key]} for key in words]
    js_test = json.dumps(test_list)
    
    with open(os.path.join("/workspaces/78624234/CS50X/project/static", "js_test.json"), "w") as f:
        f.write(js_test)
        f.close()
    
    # 后端如果仍需要字典格式，可保留原逻辑
    test = {key: dictionary[key] for key in words}
    return test, js_test

调整JavaScript代码 #

导入数组后直接使用，就能获取随机顺序的内容：

import data from './js_test.json' assert { type: 'json'};
// data是数组，顺序和Python生成的完全一致
console.log(data);

// 遍历示例
data.forEach(item => {
    console.log(`${item.key}: ${item.value}`);
});

备选方案：使用Map结构 #

如果需要类似对象的键值访问方式，同时保留顺序，可以用Map：

import data from './js_test.json' assert { type: 'json'};
// 将数组转为Map，保留插入顺序
const dictMap = new Map(data.map(item => [item.key, item.value]));

// 遍历Map，顺序与生成时一致
dictMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

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