如何根據嵌套物件的屬性洗掉物件（元素）。例如，我需要從 obj 樹中洗掉所有型別為“green”的物件，如果 obj 有子物件，它也將被洗掉。
const obj = {
id: '01',
children: [
{
id: '02',
type: 'green',
children: [
{
id: '03',
type: 'black',
children: [],
},
{
id: '04',
type: 'green',
children: [
{
id: '05',
type: 'white',
children: [],
}
],
}
],
},
{
id: '06',
type: 'black',
children: [
{
id: '07',
type: 'green',
children: [],
},
{
id: '08',
type: 'white',
children: [
{
id: '09',
type: 'green',
children: [],
}
],
}
],
},
]
}
// 預期結果（如果洗掉型別：“綠色”）
const expectedObj = {
id: '01',
type: 'orange',
children: [
{
id: '06',
type: 'black',
children: [
{
id: '08',
type: 'white',
children: [],
}
],
},
]
}
我想做什么
let match = false
const removeByType = (data, type) => {
match = data.some(d => d.type == type)
if (match) {
data = data.filter(d => d.type !== type)
} else {
data.forEach(d => {
d.children = removeByType(d.children, type)
})
}
return data
}
let data = obj.children
console.dir(removeByType(data, 'black'), { depth: null })
但是 { id: '03', type: 'black', children: [] } 仍然在物件樹中
uj5u.com熱心網友回復：
你很接近，只是錯過了每個實體都是一個你必須map通過的陣列
const removeByType = (data, type) => {
data = data.filter(d => d.type !== type)
data = data.map(d => {
d.children = removeByType(d.children, type);
return d;
})
return data
}
這是一個更簡潔和優化的版本：
const removeByType = (data, type) => data.filter(d => d.type !== type)
.map(d => ({...d, children: removeByType(d.children, type)}));
const obj = {
id: '01',
children: [{
id: '02',
type: 'green',
children: [{
id: '03',
type: 'black',
children: [],
},
{
id: '04',
type: 'green',
children: [{
id: '05',
type: 'white',
children: [],
}],
}
],
},
{
id: '06',
type: 'black',
children: [{
id: '07',
type: 'green',
children: [],
},
{
id: '08',
type: 'white',
children: [{
id: '09',
type: 'green',
children: [],
}],
}
],
},
]
}
const removeByType = (data, type) => {
data = data.filter(d => d.type !== type)
data = data.map(d => {
d.children = removeByType(d.children, type);
return d;
})
return data
}
console.dir(removeByType(obj.children, 'black'), {
depth: null
})uj5u.com熱心網友回復：
我已經這樣做了..
const removeByType = (data, type) =>
{
for (let i=data.children.length;--i>=0;)
{
if ( data.children[i].type===type) data.children.splice(i,1)
else removeByType (data.children[i], type)
}
return data // just for chaining ... ?
}
用法：
const my_obj =
{ id: '01', type: 'orange', children: // stay
[ { id: '02', type: 'green', children: // - green
[ { id: '03', type: 'black', children: [] } // -
, { id: '04', type: 'green', children: // -
[ { id: '05', type: 'white', children: [] } // -
]
} ] }
, { id: '06', type: 'black', children: // stay
[ { id: '07', type: 'green', children: [] } // - green
, { id: '08', type: 'white', children: // stay
[ { id: '09', type: 'green', children: [] } // - green
]
} ] } ] }
const removeByType = (data, type) =>
{
for (let i=data.children.length;--i>=0;)
{
if ( data.children[i].type===type) data.children.splice(i,1)
else removeByType (data.children[i], type)
}
return data
}
console.log( removeByType(my_obj, 'green') )
// my_obj is now updated...
console.log( my_obj ).as-console-wrapper {max-height: 100% !important;top: 0;}
.as-console-row::after {display: none !important;}轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/537103.html