下面的React代码有什么区别？哪一个最有效？还是它们几乎一样？

Question

我目前正在一个项目中，想出了两组不同的代码，想知道两者之间是否存在差异。

ReactJS（最新版本）

1。

columns.map(v => v.aggregate = (values) => values[0]);

2。

columns = columns.map( v => ({ 
            ...v,
            aggregate : (values) => values[0]
        }))

预期结果：

const columns = [
    {
        Header: 'ID',
        accessor: 'empid',
        shown: true,
        width: 130
    }, {
        Header: 'Name',
        accessor: 'name',
        shown: true,
        aggregate: (values) => values[0],
        width: 130
    }, {
        Header: 'Age',
        accessor: 'age',
        shown: true,
        aggregate: (values) => values[0],
    }, {
        Header: 'Email',
        accessor: 'email',
        shown: true,
        aggregate: (values) => values[0],
        width: 150
    },  {
        Header: 'Birthday',
        accessor: 'birthday',
        shown: true,
        aggregate: (values) => values[0],
        width: 150
    }
];

我将其添加到ReactTable组件中，并通过id进行聚合。

Answer 1

在第一个示例中，您将直接突变每个对象。在第二个示例中，您首先使用了散布运算符，因此首先要浅表复制每个对象，而不是直接对其进行变异。