无法找出执行某些任务的给定本机替代代码

Question

无法确定给定的本机替代代码执行的某些任务，该任务创建将元素数组拆分为给定size参数组的元素。

使用lodash，我已经使用_.chunk解决了此任务，但是文档中有两个版本，一个是lodash，另一个是本机JavaScript。

我对本机版本感兴趣，并且已经开始对其进行解密，但我无法弄清楚。我知道reduce的工作方式，但有条件的部分是我被卡住的地方。我知道如果条件为真，它将返回某个值，但是对于我来说仍然不清楚，尤其是返回的带有括号的值，如果有人可以详细解释，将不胜感激。

// Lodash

_.chunk(['a', 'b', 'c', 'd'], 3); // This one is solve 
// => [['a', 'b', 'c'], ['d']]


// Native

const chunk = (input, size) => {
   return input.reduce((arr, item, idx) => {
      return idx % size === 0 // This entire part of conditional is not clear
        ? [...arr, [item]]
        : [...arr.slice(0, -1), [...arr.slice(-1)[0], item]];
   }, []);
};

chunk(['a', 'b', 'c', 'd'], 3);
// => [['a', 'b', 'c'], ['d']]

Answer 1

所有代码正在做的是

• 创建一个空数组。
• 它将在该数组内创建另一个嵌套的空数组[]。
• 它每次都会将每个元素添加到该嵌套数组中。
• 如果索引是3的倍数，它将添加另一个嵌套数组并继续向其中添加元素

更容易理解的版本是。

const chunk = (input, size) => {
   return input.reduce((arr, item, idx) => {
   
      if(idx % size === 0){
        //The previous nested arrays
        let previous = arr; 
        //Adds a new nested array with current element
        let newArr = [item]; 
        //concentrate both and return
        return arr.concat([newArr]); 
      } 
      else{
        //This is part of array which concatin all nested arrays expect the last one
        let allExepctLast = arr.slice(0, -1);
        //this is last nested array
        let last = arr.slice(-1)[0];
        //Add the current element to the end of last nested array.
        let addedValue = [...last,item]
        return [...allExepctLast ,addedValue]
      
      }
   }, []);
};
console.log(chunk(['a', 'b', 'c', 'd'], 3));

示例说明。

考虑上述数组['a', 'b', 'c', 'd']

arr被初始化为空数组[]。

idx = 0和item = 'a'

当idx为0时，条件idx % size === 0为true，因此返回值将为。

[...arr, [item]]

arr是空的，因此传播它将什么也没有。 [item]将是['a']。因此整个arr变为

[['a']]

idx = 1和item = 'b'

这一次条件idx % size为false，因此返回的值为

[...arr.slice(0, -1), [...arr.slice(-1)[0], item]]

arr.slice(0,-1)将为空数组，因此扩展将为空。

arr.slice(-1)[0]将获得最后一个嵌套数组['a']，并将在末尾添加item。这样就变成了['a','b']。因此arr变成[['a','b']]

idx = 2和item = 'c'

与idx = 1相同的事件将发生。最后的数组将变为。

[[''a'，'b'，c]]

idx = 3和item = 'd'

现在第一个条件是true，因此将返回[...arr, [item]]。

...arr将生成第一个嵌套数组['a','b','c']，而[item]将是['d']都包裹在[]中将得到

[['a','b','c'], ['d']]