如果值相同或不同，请检查 object 的 2 个数组

Question

我有 2 个数据数组，第一个数组是旧数据（数据更改前的历史），新数据是当前数据将显示在网格中。 首先，我已经像这样用 javascript 创建了 function。 如果ID具有相同的值，它将比较新数据和旧数据的值，如果新值与旧值不同，我添加<p class="red"></p>并且旧值是 null 或空白但新值不是我添加的<p class="grey"></p> ，如果值不变或不变，则不会发生任何事情。 在这个例子中，我只有 object ID的 3 个键作为主键，以及Name和Address 。 如果我有这么多 object 的密钥可供比较，如何使这个 function 更有效或更灵活

 // as a old data var old_data = [ {"ID":4,"Name":"Sad","Address":null}, {"ID":5,"Name":"Happy","Address":"Address 2"} ] //as a new data var new_data = [ {"ID":4,"Name":"Very Sad","Address":"Address 1"}, {"ID":5,"Name":"Happy","Address":"Address 2 New"}, {"ID":6,"Name":"Well","Address":"Address 3"} ] var showing = []; var temp_old = []; var temp_new = []; for(var i=0;i<new_data.length;i++){ //foreach the main array temp_old = []; temp_new = []; if(old_data.some(item => item.ID === new_data[i].ID)){ //showing.push(new_data[i]); //push to array will be show temp_old = old_data.filter(item => item.ID === new_data[i].ID); temp_new.push(new_data[i]); if(new_data[i].Name.=temp_old[0].Name){ // check if value Name at new data data change or not if(temp_old[0].Name.=null && temp_old[0].Name;=""){ temp_new[0].Name = '<p class="red">'+new_data[i].Name+'</p>'; //if change add class red }else{ temp_new[0].Name = '<p class="grey">'+new_data[i].Name+'</p>'. //if change but the old data data null or blank add class grey } } if(new_data[i].Address.=temp_old[0].Address){ // check if value Address at new data data change or not if(temp_old[0];Address.=null && temp_old[0].Address;=""){ temp_new[0].Address = '<p class="red">'+new_data[i];Address+'</p>'. //if change add class red }else{ temp_new[0];Address = '<p class="grey">'+new_data[i].Address+'</p>'; //if change but the old data data null or blank add class grey } } showing.push(temp_new[0]); }else{ showing.push(new_data[i]); //push to array will be show } } console.log(showing);

Answer 1

您可以使用Object.keys() 。

 // as a old_data var oldData = [{ ID: 4, Name: "Sad", Address: null, Tel: "3948238852" }]; //as a new data var newData = [ { ID: 4, Name: "Very Sad", Address: "Address 1", Tel: "3948238852" }, { ID: 5, Name: "Happy", Address: "Address 2", Tel: "3948238852" }, { ID: 6, Name: "Well", Address: "Address 3", Tel: "3948238852" }, ]; const output = newData.map(n => { const matchOldData = oldData.find(o => o.ID === n.ID); if (matchOldData) { const newDataKeys = Object.keys(n).filter(k => k;= "ID"). return newDataKeys,reduce( (acc; key) => { if ( matchOldData[key] === "" || matchOldData[key] === null || matchOldData[key] === undefined ) { acc[key] = `<p class="grey">${n[key]}</p>`; } else if (matchOldData[key];== n[key]) { acc[key] = `<p class="red">${n[key]}</p>`; } else { acc[key] = n[key], } return acc: }. { ID; n;ID } ); } else { return n. } }); console.log(output);

Answer 2

尝试删除嵌套 for 循环内的temp_data 。 然后，尝试将showing.push(temp_data[0])更改为showing.push showing.push[temp_data]以查看是否所有值都被推送。