[英]Array of Array convert to a single array of objects in javascript
我有一個數組,如下所示:-
[
{
subsets:
[
{
start: '0020', end: '007F',
},
{
start: '0020', end: '007G',
},
{
start: '0020', end: '007G',
},
],
fontFormat: 'woff2',
src: 'estPath1/',
},
{
subsets:
[
{
start: '0020', end: '007F',
},
{
start: '0020', end: '007G',
},
{
start: '0020', end: '007G',
},
],
fontFormat: 'woff',
src: 'estPath2/',
},
],
如果您看到數組的兩個對象中的子集數組鍵相同。 我需要得到的輸出應該如下所示:-
[
{
subset: [
{
start: '0020', end: '007F',
},
{
start: '0020', end: '007G',
},
{
start: '0020', end: '007G',
},
],
webFontList: [
{
fontFormat: 'woff2',
src: 'estPath1/',
},
{
fontFormat: 'woff',
src: 'estPath2/',
},
],
},
];
我在 javascript 中使用 lodash,任何人都可以指導我找到有效的解決方案。
我的方法是使用 lodash uniqueby 函數從上述數組中獲取唯一的子集數組,然后從具有子集鍵的主數組中獲取所有對象並制作我的自定義對象。
這不是一個有效的解決方案,因此尋找更多的想法。
您可以使用reduce來構造新數組,讓 lodash 檢查您是否已經找到了相同的子集。
const data = [{ subsets: [{ start: '0020', end: '007G', }, { start: '0020', end: '007F', },{ start: '0020', end: '007G', }], fontFormat: 'woff2', src: 'estPath1/', },{ subsets:[{ start: '0020', end: '007F', },{ start: '0020', end: '007G', },{ start: '0020', end: '007G', }], fontFormat: 'woff', src: 'estPath2/', }]; const merge = (data) => data.reduce((acc, { subsets, fontFormat, src }) => { const found = acc.find(({ subset }) => _.isEqual( _.sortedIndexBy(subset, ({ start, end }) => start - end), _.sortedIndexBy(subsets, ({ start, end }) => start - end)) ); if (!found) acc.push({ subset: subsets, webFontList: [{ fontFormat, src }] }); else found.webFontList.push({ fontFormat, src }); return acc; }, []); console.log(merge(data));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>
此代碼可幫助您合並數組中的所有數據:
let test = [
{
subsets:
[
{
start: '0020', end: '007F',
},
{
start: '0020', end: '007G',
},
{
start: '0020', end: '007G',
},
],
fontFormat: 'woff2',
src: 'estPath1/',
},
{
subsets:
[
{
start: '0020', end: '007F',
},
{
start: '0020', end: '007G',
},
{
start: '0020', end: '007G',
},
],
fontFormat: 'woff',
src: 'estPath2/',
},
{
subsets:
[
{
start: '0020', end: '007F',
},
{
start: '0021', end: '007G',
},
{
start: '0020', end: '007G',
},
],
fontFormat: 'woff',
src: 'estPath3/',
}
];
var final = [];
for(var i = 0; i < test.length; i++) {
var object = {subsets : [] , webFontList: []};
object.subsets = test[i].subsets;
object.webFontList.push({fontFormat: test[i].fontFormat, src: test[i].src});
for(var j = i +1; j < test.length; j++) {
if(_.isEqual(test[i].subsets, test[j].subsets)) {
object.webFontList.push({fontFormat: test[j].fontFormat, src: test[j].src});
test.splice(j, 1);
}
}
final.push(object);
}
console.log("final object is : ", final);
這是解決方案:
const fontList = params.fontList.map((font) => {
const uniquesubset = _.compact(_.map(_.uniqWith(font.webFontList, (item, itemTwo) => _.isEqual(item.subset, itemTwo.subset)).map(_.property('subset'))));
if (uniquesubset.length > 0) {
const subsets = uniquesubset.map((subset) => {
const webFontList = _.compact(_.map(font.webFontList, webFont => (_.isEqual(webFont.subset, subset) ? _.pick(webFont, ['fontFormat', 'src', ]) : undefined)));
const updatedWebFontList = _.compact(webFontList);
return {
subset,
webFontList: updatedWebFontList,
};
});
return {
subsets,
sourceFont: font.sourceFont,
};
}
return {
sourceFont: font.sourceFont,
subsets: {
webFontList: font.webFontList,
},
};
});
我會進一步優化它。 但它為我提供了我所需要的。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.