javascript - 下面的 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
    }
];

我将通过 id 将其添加到带有聚合枢轴的 ReactTable 组件中。

Answer 1

在第一个示例中，您直接改变每个对象。在第二个示例中，您首先使用扩展运算符，因此您首先浅层复制每个对象，而不是直接改变它。