Question

例如以下

var data = {
    'States': ['NSW', 'VIC'],
    'Countries': ['GBR', 'AUS'],
    'Capitals': ['SYD', 'MEL']
}
for (var item in data) {
    console.log(item);
}

打印

States
Countries
Capitals

有没有办法按字母顺序排序，以便打印

Capitals
Countries
States

Answer 1

不在对象本身内：对象的属性集合是无序的。

您可以做的一件事是使用Object.keys()，然后对数组进行排序，然后迭代它。

Object.keys(data)
      .sort()
      .forEach(function(v, i) {
          console.log(v, data[v]);
       });

不支持ECMAScript第5版的浏览器的补丁（实现）：

Answer 2

是的，有。不在ECMAScript标准内，但跨浏览器和Node.js支持，并且显然稳定。请参阅https://stackoverflow.com/a/23202095/645715。

编辑：这将返回一个订购密钥的对象。您可以使用Object.keys(...)从对象中获取有序键。

为什么要担心对象键顺序？差异在某些应用程序中很重要，例如使用xml2js解析XML，它将XML表示为嵌套对象，并使用XML标记作为哈希键。

有几个笔记：

看起来像整数的键首先按数字顺序显示。
看起来像字符串的键会出现在下一个插入顺序中。
此订单由Object.keys(obj)
for (var key in obj) {...}报告的顺序在Safari，Firefox

该函数返回一个对象，其中按字母顺序插入排序键：

function orderKeys(obj, expected) {

  var keys = Object.keys(obj).sort(function keyOrder(k1, k2) {
      if (k1 < k2) return -1;
      else if (k1 > k2) return +1;
      else return 0;
  });

  var i, after = {};
  for (i = 0; i < keys.length; i++) {
    after[keys[i]] = obj[keys[i]];
    delete obj[keys[i]];
  }

  for (i = 0; i < keys.length; i++) {
    obj[keys[i]] = after[keys[i]];
  }
  return obj;
}

这是一个快速测试：

var example = { 
      "3": "charlie",
      "p:style": "c",
      "berries": "e",
      "p:nvSpPr": "a",
      "p:txBody": "d",
      "apples": "e",
      "5": "eagle",
      "p:spPr": "b"
    }

var obj = orderKeys(example);

返回

{ '3': 'charlie',
  '5': 'eagle',
  apples: 'e',
  berries: 'e',
  'p:nvSpPr': 'a',
  'p:spPr': 'b',
  'p:style': 'c',
  'p:txBody': 'd' }

然后您可以将订购的密钥作为：

Object.keys(obj)

返回

["3", "5", "apples", "berries", "p:nvSpPr", "p:spPr", "p:style", "p:txBody"]

Answer 3

这是一个很好的功能解决方案：

基本上，

使用Object.keys
sort密钥
将列表缩减回对象以获得所需结果

ES5解决方案：

not_sorted = {b: false, a: true};

sorted = Object.keys(not_sorted)
    .sort()
    .reduce(function (acc, key) { 
        acc[key] = not_sorted[key];
        return acc;
    }, {});

console.log(sorted) //{a: true, b: false}

ES6解决方案：

not_sorted = {b: false, a: true}

sorted = Object.keys(not_sorted)
    .sort()
    .reduce((acc, key) => ({
        ...acc, [key]: not_sorted[key]
    }), {})

console.log(sorted) //{a: true, b: false}

Answer 4

我会将其添加为@prototype的评论，但我的代表不够高。

如果有人需要@prototype wrote符合eslint-config-airbnb的orderKeys版本：

/**
 * Returns and modifies the input object so that its keys are returned in sorted
 * order when `Object.keys(obj)` is invoked
 *
 * @param {object} obj The object to have its keys sorted
 *
 * @returns {object} The inputted object with its keys in sorted order
 */
const orderKeys = (obj) => {
  // Complying with `no-param-reassign`, and JavaScript seems to assign by reference here
  const newObj = obj;
  // Default `.sort()` chained method seems to work for me
  const keys = Object.keys(newObj).sort();

  const after = {};
  // Add keys to `after` in sorted order of `obj`'s keys
  keys.forEach((key) => {
    after[key] = newObj[key];
    delete newObj[key];
  });

  // Add keys back to `obj` in sorted order
  keys.forEach((key) => {
    newObj[key] = after[key];
  });

  return newObj;
};

使用@prototype的测试：

const example = { 
  3: 'charlie',
  'p:style': 'c',
  berries: 'e',
  'p:nvSpPr': 'a',
  'p:txBody': 'd',
  apples: 'e',
  5: 'eagle',
  p:spPr: 'b'
}

const obj = orderKeys(example);

console.log(obj);

console.log(Object.keys(obj));

输出以下内容：

Babel Compiler v6.4.4
Copyright (c) 2014-2015 Sebastian McKenzie

{ 3: 'charlie',
  5: 'eagle',
  apples: 'e',
  berries: 'e',
  'p:nvSpPr': 'a',
  'p:spPr': 'b',
  'p:style': 'c',
  'p:txBody': 'd' }
[ '3',
  '5',
  'apples',
  'berries',
  'p:nvSpPr',
  'p:spPr',
  'p:style',
  'p:txBody' ]

无论价值多少，我都需要在我的React应用程序中使用它，以便我可以对基于state对象的下拉菜单的选项进行排序，该对象是在API响应后分配的。

最初我做了

return (
  // ...
  <Select
    options={Object.keys(obj).sort()}
    // ...
  />
  // ...
);

但是意识到.sort()方法将在每次重新渲染时调用，因此需要@prototype的orderKeys实现。

https://stackoverflow.com/users/645715/prototype

Answer 5

您也可以通过这种方式对其进行排序。

const data = {
  States: ['NSW', 'VIC'],
  Countries: ['GBR', 'AUS'],
  Capitals: ['SYD', 'MEL']
}

const sortedObject = Object.fromEntries(Object.entries(data).sort())

我无法详细解释它为什么有效，但显然它可以完美运行:)如果您不相信我，请尝试一下：D

请注意，您的浏览器或Node.js版本应支持Object.fromEntries

关于浏览器兼容性，请检查this page的底部

对于Node，它将适用于12及更高版本。对于v1中的Deno。

Answer 6

这里是使用lodash

对对象键进行排序的单线

_.chain(obj).toPairs().sortBy(0).fromPairs().value()

带有示例数据：

var data = {
    'States': ['NSW', 'VIC'],
    'Countries': ['GBR', 'AUS'],
    'Capitals': ['SYD', 'MEL']
}
data = _.chain(data)
  .toPairs() // turn the object into an array of [key, value] pairs
  .sortBy(0) // sort these pairs by index [0] which is [key]
  .fromPairs() // convert array of pairs back into an object {key: value}
  .value() // return value
/*
{
  Capitals: [ 'SYD', 'MEL' ],
  Countries: [ 'GBR', 'AUS' ],
  States: [ 'NSW', 'VIC' ]
}
*/

Answer 7

如果转换为数组不适合您的模板并且您知道对象的键，则还可以执行以下操作：

在你的控制器中用正确的顺序定义一个包含键的数组：

this.displayOrder = [
    'firstKey',
    'secondKey',
    'thirdKey'
];

在模板中重复displayOrder的按键，然后使用ng-init引用回到对象。

<div ng-repeat="key in ctrl.displayOrder" ng-init="entry = ctrl.object[key]">
     {{ entry.detail }}
</div>

有没有办法在JavaScript对象中对键进行排序/排序？

7 个答案: