比较两个对象数组，按array1的顺序保留array2中的项目

Question

我有 2 个对象数组：

const headers1 = [

    {text: 'ID', value: 'id', active: true},

    {text: 'Name', value: 'name', active: true},

    {text: 'Age', value: 'age', active: false},

    {text: 'Address', value: 'address', active: true},

    {text: 'Phone', value: 'phone', active: true}, //should be excluded because are not on headers2

]

和

const headers2 = [

    {text: 'Name',value:'name', active: true},

    {text: 'Age',value:'age', active: true}, 

    {text: 'Address',value:'address', active: true},

    {text: 'ID',value: 'id', active: true},               

    {text: 'Config',value: 'config', active: false}, //should be included at the end

    {text: 'Options',value: 'options',active: true} //sould be included at the end

]

所以基本上我需要headers2从headers1. headers2未打开的项目headers1应放在最后。结果应该是这样的：

const headers3 = [

    {text: 'ID', value: 'id', active: true},

    {text: 'Name', value: 'name', active: true},

    {text: 'Age', value: 'age', active: false},

    {text: 'Address', value: 'address', active: true},

    {text: 'Config', value: 'config', active: false},

    {text: 'Options', value: 'options', active: true}

]

Answer 1

只需按另一项中匹配项的索引进行排序，如果-1将索引设置为Infinity：const headers1 = [    {text: 'ID', value: 'id', active: true},    {text: 'Name', value: 'name', active: true},    {text: 'Age', value: 'age', active: false},    {text: 'Address', value: 'address', active: true},    {text: 'Phone', value: 'phone', active: true} //should be excluded because are not on headers2]const headers2 = [    {text: 'Name', value: 'name', active: true},    {text: 'Age', value: 'age', active: true},     {text: 'Address', value: 'address', active: true},    {text: 'ID', value: 'id', active: true},                   {text: 'Config', value: 'config', active: false}, //should be included at the end    {text: 'Options', value: 'options', active: true} //sould be included at the end]const headers3 = [...headers2].sort((a, b) => {    const aIndex = headers1.findIndex((i) => i.text === a.text) + 1 || Infinity;    const bIndex = headers1.findIndex((i) => i.text === b.text) + 1 || Infinity;    return aIndex - bIndex;}).map((i) => {    i.active = (headers1.find((el) => el.text === i.text) || i).active    return i;});console.log(headers3);

Answer 2

您可以使用想要的顺序构建一个对象，并从第二个数组中获取一个副本并对其进行排序。const headers1 = [{ text: 'ID', value: 'id', active: true }, { text: 'Name', value: 'name', active: true }, { text: 'Age', value: 'age', active: false }, { text: 'Address', value: 'address', active: true }, { text: 'Phone', value: 'phone', active: true }],    headers2 = [{ text: 'Name', value: 'name', active: true }, { text: 'Age', value: 'age', active: true }, { text: 'Address', value: 'address', active: true }, { text: 'ID', value: 'id', active: true }, { text: 'Config', value: 'config', active: false }, { text: 'Options', value: 'options', active: true }],    references = headers1.reduce((r, o, i) => (r[o.text] = { o, order: i + 1 }, r), {}),    result = headers2        .map(o => references[o.text]?.o || o)        .sort(({ text: a }, { text: b }) => (references[a]?.order || Number.MAX_VALUE) - (references[b]?.order || Number.MAX_VALUE));console.log(result);.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

您可以Map在 中的项目上使用 a headers2，由 键入name。然后从该地图中收集项目headers1，最后将地图中不匹配的项目添加到该结果中。您可以使用deletemap 的方法，因为它还返回是否找到键。就两个数组中的项目数而言，这具有线性时间复杂度。以下是它的工作原理：const headers1 = [{text: 'ID', value: 'id', active: true},{text: 'Name', value: 'name', active: true},{text: 'Age', value: 'age', active: false},{text: 'Address', value: 'address', active: true},{text: 'Phone', value: 'phone', active: true}]const headers2 = [{text: 'Name',value:'name', active: true},{text: 'Age',value:'age', active: true}, {text: 'Address',value:'address', active: true},{text: 'ID',value: 'id', active: true},{text: 'Config',value: 'config', active: false},{text: 'Options',value: 'options',active: true}];// Collect headers2 items in a map keyed by nameconst map = new Map(headers2.map(o => [o.value, o]));// First get the items from headers1 that are in the map, delete them from that map,// and then add the remaining map valueslet headers3 = [...headers1.filter(o => map.delete(o.value)), ...map.values()];// output resultheaders3.forEach(o => console.log(JSON.stringify(o)));