Порядок добавления свойств в возвращаемый объект array.reduce ()

Question

Может ли кто-нибудь объяснить, почему конечный результат одинаков в разных применениях функции array.reduce ()?

В первом случае выборочный массив сокращается напрямую, тогда как во втором примере выборочный массивСначала массив переворачивается, а затем уменьшается.

var array = [{
        "Id": "1",
        "Week": "2019-01-13"
    },
    {
        "Id": "2",
        "Week": "2019-01-20"
    },
    {
        "Id": "3",
        "Week": "2019-01-27"
    }
];

array.reduce(function (acc, curr) {
    acc[curr.Id] = curr.Week;
    console.log(acc);
    return acc;
}, {});

//Output
/*{ "1": "2019-01-13" }
{ "1": "2019-01-13", "2": "2019-01-20" }
{ "1": "2019-01-13", "2": "2019-01-20", "3": "2019-01-27" }*/

array.reverse().reduce(function (acc, curr) {
    acc[curr.Id] = curr.Week;
    console.log(acc);
    return acc;
}, {});
//Output 
/*{ "3": "2019-01-27" }
{ "2": "2019-01-20", "3": "2019-01-27" }
{ "1": "2019-01-13", "2": "2019-01-20", "3": "2019-01-27" }
*/

Я бы хотел, чтобы выходные данные отображались как {"3": "2019-01-27", "2": "2019-01-20",«1»: «2019-01-13»}.

Если я использую нечисловые клавиши, выходные данные функции уменьшения в обоих сценариях соответствуют ожидаемым (в том же порядке передаются элементы).

Answer 1

Как уже упоминалось в комментариях порядок поддержки объекта не гарантируется в JS , поэтому вы получаете этот вывод. Если вы хотите, чтобы заказ имел значение, вы должны использовать Карта в качестве reduce accumulator.

Объект Map содержит пары ключ-значение и запоминает оригинал. порядок вставки ключей.

С учетом сказанного ниже приведен пример кода, который лучше иллюстрирует его:

var array = [{ "Id": "1", "Week": "2019-01-13" }, { "Id": "2", "Week": "2019-01-20" }, { "Id": "3", "Week": "2019-01-27" } ];

let r1 = array.reduce(function(acc, curr) {
  acc.set(curr.Id, curr.Week);
  return acc;
}, new Map());

let r2 = array.reverse().reduce(function(acc, curr) {
  acc.set(curr.Id, curr.Week);
  return acc;
}, new Map());

console.log('r1:')
r1.forEach(x => console.log(x))

console.log('r2:')
r2.forEach(x => console.log(x))

console.log('fromEntries:')
console.log(Object.fromEntries(r1))
console.log(Object.fromEntries(r2))

Обратите внимание, как отличается порядок, когда мы перебираем записи двух карт (r1 & r2). Также обратите внимание, что в тот момент, когда вы convert сопоставляете литералам объектов, порядок теперь тот же, поскольку порядок поддержки JS не гарантируется.