我有一組物件，每個物件都有一個嵌套物件，我需要修改它
示例：我在下面有什么
const array = [{
asset: {key: '1235', type: 'mocFirst'},
id: 27,
marketValuey: 6509,
marketValueySecond: 65033,
marketValueyThird: 650900,
}]
我想得到那個：
const array = [{
type: 'mocFirst'
key: '1235',
id: 27,
marketValuey: 6509,
marketValueySecond: 65033,
marketValueyThird: 650900,
}]
有我的解決方案
const array = [{
asset: {key: '1235', type: 'mocFirst'},
id: 27,
marketValuey: 6509,
marketValueySecond: 65033,
marketValueyThird: 650900,
},
{
asset: {key: '12', type: 'mocFirst44'},
id: 27,
marketValuey: 6409,
marketValueySecond: 64033,
marketValueyThird: 640900,
},
{
asset: {key: '1299', type: 'mocFirst'},
id: 271,
marketValuey: 6109,
marketValueySecond: 61033,
marketValueyThird: 610900,
},
{
asset: {key: '1296', type: 'mocFirst'},
id: 272,
marketValuey: 65092,
marketValueySecond: 650332,
marketValueyThird: 6509020,
},
]
const resultArr = array.map(item => {
const { asset, ...newObj} = item;
const { key, type } = item.asset;
return { key, type, ...newObj};
});
關于我的解決方案的任何事情？也許它可以做得更好？在生產中，我會有一個大陣列
uj5u.com熱心網友回復：
給你，這是一個展平物件的遞回解決方案
function flat(source, target) {
Object.keys(source).forEach(function(k) {
if (source[k] !== null && typeof source[k] === 'object') {
flat(source[k], target);
return;
}
target[k] = source[k];
});
}
const array = [{
asset: {
key: '1235',
type: 'mocFirst'
},
id: 27,
marketValuey: 6509,
marketValueySecond: 65033,
marketValueyThird: 650900,
},
{
asset: {
key: '12',
type: 'mocFirst44'
},
id: 27,
marketValuey: 6409,
marketValueySecond: 64033,
marketValueyThird: 640900,
},
{
asset: {
key: '1299',
type: 'mocFirst'
},
id: 271,
marketValuey: 6109,
marketValueySecond: 61033,
marketValueyThird: 610900,
},
{
asset: {
key: '1296',
type: 'mocFirst'
},
id: 272,
marketValuey: 65092,
marketValueySecond: 650332,
marketValueyThird: 6509020,
},
]
let flatArr = array.map(item => {
let flatObj = {};
flat(item, flatObj);
return flatObj
});
console.log(flatArr);uj5u.com熱心網友回復：
可以選擇使用解構和.map隱式回傳來使用以下代碼獲得相同的結果。
代碼片段
const transformArray = arr => (
arr.map(
({asset : {key, type}, ...rest}) => ({key, type, ...rest})
)
);
const array = [{
asset: {key: '1235', type: 'mocFirst'},
id: 27,
marketValuey: 6509,
marketValueySecond: 65033,
marketValueyThird: 650900,
},
{
asset: {key: '12', type: 'mocFirst44'},
id: 27,
marketValuey: 6409,
marketValueySecond: 64033,
marketValueyThird: 640900,
},
{
asset: {key: '1299', type: 'mocFirst'},
id: 271,
marketValuey: 6109,
marketValueySecond: 61033,
marketValueyThird: 610900,
},
{
asset: {key: '1296', type: 'mocFirst'},
id: 272,
marketValuey: 65092,
marketValueySecond: 650332,
marketValueyThird: 6509020,
},
];
console.log(transformArray(array));uj5u.com熱心網友回復：
像這樣展平它：
var outArr = array.map(item => {
// Create the new items
item.key = item.asset.key
item.type = item.asset.item
// Delete the old parent
delete item.asset
return item
})
uj5u.com熱心網友回復：
您可以“潛在”引入的唯一加速是通過使用 afor loop而不是map方法。不幸的是，這確實取決于編譯器將如何優化您的代碼，并且只有在您使用非常大的陣列時效果才會變得明顯。基準測驗可以參考這里。
代碼的最后部分應如下所示：
const resultArr = [];
for (let i = 0; i < array.length; i = 1) {
const { asset, ...newObj} = array[i];
const { key, type } = asset;
resultArr.push({ key, type, ...newObj});
}
重要的是要了解此代碼的加速不會很明顯，并且開發人員通常更喜歡更明顯/可維護的語法，因此您的原始答案可以被認為是正確的。因此，請自行決定使用它。
uj5u.com熱心網友回復：
如果您只需要將asset.keyandasset.type分別轉換為keyand type，并且想要提高性能，那么手動分配欄位的速度比您的解決方案快 4-5 倍左右。
例如，我創建了一個array包含 1000 個專案的解決方案來比較您的解決方案（創建大約需要 2.5 毫秒array1）和我的解決方案（創建大約需要 0.5 毫秒array2）。
const N = 1000;
let array = [];
for (let i = 0; i < N; i ) {
let random_item = {
asset: {
key: Math.random(N),
type: 'mocFirst'
},
id: Math.random(N),
marketValuey: Math.random(N),
marketValueySecond: Math.random(N),
marketValueyThird: Math.random(N)
};
array.push(random_item);
}
const t0 = performance.now();
const array1 = array.map(item => {
const {
asset,
...newObj
} = item;
const {
key,
type
} = item.asset;
return {
key,
type,
...newObj
};
});
console.log(array1[10]);
const t1 = performance.now();
console.log(`Operation took ${t1 - t0} milliseconds.`);
let array2 = [];
for (let i = 0; i < array.length; i ) {
array2.push({
key: array[i].asset.key,
type: array[i].asset.type,
id: array[i].id,
marketValuey: array[i].marketValuey,
marketValueySecond: array[i].marketValueySecond,
marketValueyThird: array[i].marketValueyThird,
});
}
console.log(array2[10]);
const t2 = performance.now();
console.log(`Operation took ${t2 - t1} milliseconds.`);uj5u.com熱心網友回復：
我喜歡這個解決方案，我是通過搜索“在 javascript 中展平嵌套物件”找到的。
這是我最喜歡的答案中的實際代碼：
const crushObj = (obj = {}) => Object.keys(obj || {}).reduce((acc, cur) => {
if (typeof obj[cur] === 'object') {
acc = { ...acc, ...crushObj(obj[cur])}
} else { acc[cur] = obj[cur] }
return acc
}, {})
const obj = {
a:2,
b: {
c:3
}
}
const output = crushObj(obj)
console.log(output)
// { a: 2, c: 3 }像Lodash這樣的庫提供對此的支持會很棒。
uj5u.com熱心網友回復：
我會使用解構的概念。
array.map((elem) => {
const {
id,
marketValuey,
marketValueySecond,
marketValueyThird,
asset: {key},
asset: {type}
} = elem;
return {
id,
marketValuey,
marketValueySecond,
marketValueyThird,
key,
type
}
})
有關解構的更詳細概念，請參閱 -嵌套解構
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/451943.html
標籤：javascript
上一篇：替換字串中找到的單詞