需要帮助来理解在数组上使用 reduce() 的 react-native 代码

Question

This code is from a simple React Native Contacts app, it's supposed to use reduce method to:

for each contact in the array contacts , extract and uppercase the first letter, then return an object that maintains all the previous keys of object and appends this current contact to the key which matches it's first letter.

//contacts is an array of objects {key, name, phone}

  const contactsByLetter = props.contacts.reduce((obj, contact) => {
    const firstLetter = contact.name[0].toUpperCase()
    return {
      ...obj,
      [firstLetter]: [...(obj[firstLetter] || []), contact],
    }
  }, {})

reduce syntax is arr.reduce(callback( accumulator, currentValue[, index[, array]] )[, initialValue]) First, I don't see where the obj argument is in the syntax. Second, I understand how spread notation work but I don't get the whole return part specially [...(obj[firstLetter]

The code is in this file SectionListContacts file , the entire code here

Answer 1

Appends this current contact to the key which matches it's first letter:

  [firstLetter]: [...(obj[firstLetter] || []), contact],

For example,

{a: ['user a1', 'user a2'] }

so,

[a]: [...(['user a1', 'user a2'] || []), 'user a3']

then,

[a]: ['user a1', 'user a2', 'user a3']

[ EDITED ]

obj is the previous value. The first value of it is the initial value set like

const initialValue = 10;
[1,2,3].reduce((prev, current) => prev + current, initialValue)
// 10 + (1+2+3) = 16

In your case, obj initial value is {} .