javascript - 为什么当我返回数组而不是回调函数中的某些原语时，map 的工作方式有所不同？

Question

脚本

var companies=[
{name:'Vicky',category:'Devdas',start:1993,end:2090},
{name:'Vikrant',category:'Devdas',start:1994,end:2019},
{name:'Akriti',category:'mental',start:1991,end:2021},
{name:'Dummy',category:'dummyCategory',start:1995,end:2018},
{name:'Dummy 1',category:'dummyCategory',start:1993,end:2029}
];
var mappingComp=companies.map(company=>{company.start+10;return company});
console.log("mapped company function");
console.log(mappingComp.forEach(company=>console.log(company))); 

在上面的代码片段中，公司数组的起始字段没有变化。为什么？

如果我执行下面的操作，我会从公司数组中获取起始字段的修改值。

var mappingComp=companies.map(company=>company.start+10);

Answer 1

您没有将 company.start+10 的结果分配给任何东西 - 它只是一个孤立的表达式。

var mappingComp = companies.map(company => {
  company.start + 10;
  return company
});

就像

var mappingComp = companies.map(company => {
  33;
  return company
});

表达式被计算为一个值，然后被丢弃。如果您想将 10 添加到 company.start 中，请使用 += 或 =:

var companies=[
{name:'Vicky',category:'Devdas',start:1993,end:2090},
{name:'Vikrant',category:'Devdas',start:1994,end:2019},
{name:'Akriti',category:'mental',start:1991,end:2021},
{name:'Dummy',category:'dummyCategory',start:1995,end:2018},
{name:'Dummy 1',category:'dummyCategory',start:1993,end:2029}
];
var mappingComp = companies.map(company => {
  company.start += 10;
  return company;
});
console.log(mappingComp);

但这会改变原始数组，这在使用 map 时(通常)不是一个好主意。如果您不想更改原始数组，请映射到新对象:

var companies=[
{name:'Vicky',category:'Devdas',start:1993,end:2090},
{name:'Vikrant',category:'Devdas',start:1994,end:2019},
{name:'Akriti',category:'mental',start:1991,end:2021},
{name:'Dummy',category:'dummyCategory',start:1995,end:2018},
{name:'Dummy 1',category:'dummyCategory',start:1993,end:2029}
];
var mappingComp = companies.map(({ start, ...rest }) => ({
  start: start + 10,
  ...rest
}));
console.log(mappingComp);