为什么在过滤简单对象数组时发生突变?

时间:2018-11-29 07:08:22

标签: javascript arrays

简单来说,我的意思是数组内的对象仅包含基元。根据规格:

  

...筛选器按升序对数组中的每个元素调用一次callbackfn,并构造一个新数组,其中所有值均由callbackfn返回true。 ...

那么为什么在此示例中我基本上得到了指向初始数组而不是新数组的链接?

$date = '2018-12-25';
$obj = Carbon::now();
$offset = $obj->diffInDays($date);

https://codepen.io/fanich37/pen/NEEqNp

1 个答案:

答案 0 :(得分:0)

Array.filter 不返回object,它仅返回truefalse。当它返回true时,原始数组的值将被推送到新数组。随着objects被引用传递 ,即使它们被2个数组引用,它们仍继续共享引用。

因此,您需要在此处更改逻辑以确保引用已更改,即您添加了一个指向其他引用的对象。

您可以按照以下方式使用Array.map

const array = [{id: 1, parent: 0},{id: 2, parent: 1},{id: 3, parent: 1},{id: 4, parent: 1}];

const newArray = array.filter(el => el.id === 2).map(el => ({...el}));
console.log('array[1] === newArray[0]: ', array[1] === newArray[0]);

或者您可以像下面这样使用Array.reduce

const array = [{id: 1, parent: 0},{id: 2, parent: 1},{id: 3, parent: 1},{id: 4, parent: 1}];

const newArray = array.reduce((a,c) => {
  if(c.id===2) a.push({...c});
  return a;
}, []);
console.log('array[1] === newArray[0]: ', array[1] === newArray[0]);