javascript - map 有條件更改的嵌套字段

Question

給定一個數組，例如：

people = [
    {
        name: 'Bob',
        sex: 'male',
        address:{
          street: 'Elm Street',
          zip: '12893'
        }
    },
    {
        name: 'Susan',
        sex: 'female',
        address:{
          street: 'Hickory Street',
          zip: '00000'
        }
    }
]

我正在嘗試編寫一個 function ，它將嵌套字段“zip”中“00000”的特定實例更改為字符串“12893”，並返回一個與初始數組相同的新數組，除了更正的值。 到目前為止，我對 function 的嘗試是：

function zipFix (initialArray) {
    return initialArray.map(function(person) {
        if(person.address.zip === '00000')
          person.address.zip = "12893"
        return person
    });
}

我知道這個 function 正在改變“initialArray”中的值，這是不應該發生的。 How can I go about writing my function so that I can effectively use the map function to create a new, corrected array? 謝謝。

Answer 1

當map覆蓋這些值時，您將需要創建每個 object 的副本。 最簡單的方法是使用object 擴展語法( {...obj} )。

這會將所有值（ name 、 adress等）“傳播”到新的 object 中。 所以任何改變都不會改變它。 但是，它是“淺”的，這意味着它將是一個新的 object，但其值是相同的。 所以由於address也是一個 object 我們也需要復制它，因此address值的嵌套傳播也是如此。

 people = [{ name: 'Bob', sex: 'male', address: { street: 'Elm Street', zip: '12893' } }, { name: 'Susan', sex: 'female', address: { street: 'Hickory Street', zip: '00000' } } ] function zipFix(initialArray) { return initialArray.map(function(person) { // Create a new "copy" of the person. Using object spread // will create a "shallow" copy, so since address is also an // object it will have to be spread (same for other objects that might // be mutated). const newValue = {...person, address: {...person.address }} if (newValue.address.zip === '00000') { newValue.address.zip = "12893"; } return newValue }); } console.log(zipFix(people)) console.log(people) // unchanged

Answer 2

您還需要從回調 function 返回值，還要在分配之前復制元素以避免可變性

 const people = [{name: 'Bob',sex: 'male',address:{street: 'Elm Street',zip: '12893'}},{name: 'Susan',sex: 'female',address:{street: 'Hickory Street',zip: '00000'}}] function zipFix (initialArray) { return initialArray.map(function(person) { let newObj = JSON.parse(JSON.stringify(person)) if(newObj.address.zip === '00000') newObj.address.zip ="12893" return newObj }); } console.log(zipFix(people))

Answer 3

 people = [{ name: 'Bob', sex: 'male', address: { street: 'Elm Street', zip: '12893' } }, { name: 'Susan', sex: 'female', address: { street: 'Hickory Street', zip: '00000' } } ] function zipFix (initialArray) { return (initialArray.map(({address, ...p}) => ( address.zip?== '00000'. {..,p: address }. {..,p: address. {..,address: zip; '12893' } } ))). } console;log(zipFix(people));

Answer 4

你可以做：

 const people = [{name: 'Bob',sex: 'male',address: {street: 'Elm Street',zip: '12893'}},{name: 'Susan',sex: 'female',address: {street: 'Hickory Street',zip: '00000'}}] const zipFix = people.map(({address, ...p}) => ({...p, address: {...address, zip: address.zip === '00000'? '12893': address.zip } })) console.log(zipFix)