使用lodash轉換時如何包括刪除的數組項

Question

我正在使用lodash變換通過比較兩個對象來生成更改消息。 我需要檢測某個項目是否已從數組中刪除，並將該項目包括在更改消息中。 如何將刪除的項目推回到更改后的數組上？

 var lhs = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 2, "MonthlyIncome": 1000, "Type": "Overtime" } ] }; var rhs = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 0, "MonthlyIncome": 500, "Type": "Other" } ] }; function difference(base, object) { function changes(object, base) { return _.transform(object, function(result, value, key) { if (!_.isEqual(value, base[key]) || key === 'Id') { if (!_.isEqual(value, base[key]) && key === "Id") { //The item at this position has been removed, //but needs to be include in the change message //How to push this item onto the array ? var removedItem = { Id: base[key], Action: "remove" } } result[key] = _.isObject(value) && _.isObject(base[key]) ? changes(value, base[key]) : value; } }); } return changes(object, base); } var changeMessage = JSON.stringify(difference(lhs, rhs)); console.log(changeMessage); 

 <script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script> 

changeMes​​sage的預期結果

{
    "Income": [
        {
            "Id": 0,
            "MonthlyIncome": 500,
            "Type": "Other"
        },
        {
            "Id": 2,
            "Action": "remove"
        }
    ]
}

Answer 1

將removedItem在result 。

 var lhs = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 2, "MonthlyIncome": 1000, "Type": "Overtime" } ] }; var rhs = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 0, "MonthlyIncome": 500, "Type": "Other" } ] }; function difference(base, object) { function changes(object, base) { return _.transform(object, function(result, value, key) { if (!_.isEqual(value, base[key]) || key === 'Id') { if (!_.isEqual(value, base[key]) && key === "Id") { // stash the removedItem to the result result.removedItem = { Id: base[key], Action: "remove" } } result[key] = _.isObject(value) && _.isObject(base[key]) ? changes(value, base[key]) : value; } }); } return changes(object, base); } var changeMessage = JSON.stringify(difference(lhs, rhs)); console.log(changeMessage); 

 <script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script> 

Answer 2

您也可以通過lodash來實現相同的目的：

 var ld = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 2, "MonthlyIncome": 1000, "Type": "Overtime" } ] }; var rd = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 0, "MonthlyIncome": 500, "Type": "Other" } ] }; const changes = (a,b) => _.filter(_.values(b.Income), x => !_.includes(_.mapValues(a.Income, 'Id'),x.Id)) const compare = (l,r) => { var plus = changes(l,r) var minus = _.map(changes(r,l), ({Id}) => ({ Id, Action: "remove" })) return [...plus, ...minus] } console.log(compare(ld,rd)) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script> 

與ES6相同：

 var ld = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 2, "MonthlyIncome": 1000, "Type": "Overtime" } ] }; var rd = { "Income": [{ "Id": 1, "MonthlyIncome": 5000, "Type": "Base" }, { "Id": 0, "MonthlyIncome": 500, "Type": "Other" } ] }; const ids = d => d.map(x => x.Id) const changes = (a,b) => Object.values(b.Income).filter(x => !ids(a.Income).includes(x.Id)) const compare = (l,r) => { var plus = changes(l,r) var minus = changes(r,l).map(({Id}) => ({ Id, Action: "Removed" })) return [...plus, ...minus] } console.log(compare(ld,rd))