用括号键减少功能

Question

我对以下代码行的含义感到困惑：

if(!acc[key])

这是我对这行的解释：

如果key不在acc中，则将key设置为value数组并跳出if语句。然后将obj推入acc键值。

如果key在acc中，跳过if语句并使用另一个内存acc[key]并设置key在acc中并使用obj设置值。 （需要大修）

我的解释正确吗？

var people = [{
    name: 'Alice',
    age: 21
  },
  {
    name: 'Max',
    age: 20
  },
  {
    name: 'Jane',
    age: 20
  }
];

function groupBy(objectArray, property) {
  return objectArray.reduce(function(acc, obj) {
    var key = obj[property];
    if (!acc[key]) {
      acc[key] = [];
      acc[key].push(obj)
    }
    return acc;

  }, {});
}
var groupedPeople = groupBy(people, 'age')
console.log(JSON.stringify(groupedPeople))

Answer 1

方括号[] 用于dynamic property notation（也称为计算属性名称）。是这样的：

var obj = { foo: "bar" };
var propertyWeWant = "foo"; //We want to get obj.foo - the value "bar"
console.log(obj.propertyWeWant); //Returns undefined
console.log(obj[propertyWeWant]); //Returns bar

函数groupBy 接受一个人数组，并返回按传递的属性分组的人（在本例中为age）：

var people = [{
    name: 'Alice',
    age: 21
  },
  {
    name: 'Max',
    age: 20
  },
  {
    name: 'Jane',
    age: 20
  }
];

function groupBy(objectArray, property) {
  return objectArray.reduce(function(acc, obj) {
    var key = obj[property];
    if (!acc[key]) {
      acc[key] = [];
    }
    acc[key].push(obj)
    return acc;

  }, {});
}
var groupedPeople = groupBy(people, 'age')
console.log(JSON.stringify(groupedPeople))

Answer 2

!acc[key] 表示如果key 属性（它是动态的，就像@Jack Bashford 所说的那样）在对象acc 中不存在，它将返回false。 reduce 将起作用

1. acc 使用 {}
初始化
2. 循环进入第一个对象：key = '21'，但acc['21'] 是undefined 运行if 的块代码
3. 2nd: key = '20' and !acc[key] return true ~> 设置acc['20'] = obj
4. 最后一个对象。 key = '20'，但 acc['20'] 在第 3 步有值 ~> 跳过块代码并返回 acc
5. 返回acc 2 键“20”和“21”

结果以 20 开头的原因是我认为浏览器想要打印按字母排序的对象的属性。