创建具有元素路径数组的嵌套数组



我有这个数组:

var array ={data: [
{ id:'1',
name:'first',
data:[]
}]}

我有这条路:path = ['3','1','2'];如何根据路径动态推送数据并创建以下内容:

array.data= myData;
array.data[3].data= myData;
array.data[3].data[1].data =myData;
array.data[3].data[1].data[2].data= myData;

myData 存储来自服务器的数据,每次都会更改

我的数据示例

var myData = 
{ id:'5',
name:'abc',
data:[]
},
{ id:'7',
name:'def',
data:[]
}

想要的结果应该是这样的: 我希望能够像这样创建这个数组,并且像上面一样可以访问数据。

var array ={data: [
{ id:'1',
name:'first',
data:[]
},{ id:'2',
name:'first',
data:[]
},
{ id:'3',
name:'first',
data:[]
},
{ id:'4',
name:'first',
data:[
{ id:'5',
name:'first',
data:[]
},
{ id:'6',
name:'first',
data:[
{ id:'7',
name:'first',
data:[]
},
{ id:'8',
name:'first',
data:[
{ id:'8',
name:'first',
data:[]
},
{ id:'8',
name:'first',
data:[]
}]
}]
}]
}]}

您可以通过保留最后一个索引来减少路径,并将结果对象作为起始值。

reduce内部将数组分配给data,如果它不存在,则将一个新对象分配给data属性,并将路径数组的实际值作为索引。

var result = {},
data = { id: '1', name: 'first' },
path = [3, 1, 2],
last = path.pop(),
final = path.reduce((o, i) => {
o.data = o.data || [];
return o.data[i] = o.data[i] || {};
}, result);
final[last] = Object.assign({}, data, final[last] && { data: final[last].data });
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

如果我正确理解您的问题,您希望动态构造一个对象(即如下所示result(,即来自提供的path数组的myData对象的嵌套克隆。

产生所需访问方法(即array.data[3].data[1].data[2].data(的一种方法是通过path数组上的reduceRight()方法,如下所示:

const myData = { id: '1', name: 'first' };
const path = ['3', '1', '2'];
const array = { 
data : path.reduceRight((acc, part) => 
({ [part] : { data : { ...acc, ...myData } }}), {}) 
}
console.log(array.data[3].data);
console.log(array.data[3].data[1].data);
console.log(array.data[3].data[1].data[2].data);

最新更新