1 changed files with 153 additions and 0 deletions
@ -0,0 +1,153 @@ |
|||||||
|
## DATA DIFF |
||||||
|
|
||||||
|
This library compares two arrays or objects and return a complete diff of their differences. |
||||||
|
|
||||||
|
# Object exemple: |
||||||
|
|
||||||
|
`getObjectDiff()` checks base properties but also provides a complete diff of nested properties. |
||||||
|
|
||||||
|
Input |
||||||
|
|
||||||
|
```js |
||||||
|
getObjectDiff( |
||||||
|
{ |
||||||
|
id: 54, |
||||||
|
user: { |
||||||
|
name: "joe", |
||||||
|
member: true, |
||||||
|
hobbies: ["golf", "football"], |
||||||
|
age: 66, |
||||||
|
}, |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 54, |
||||||
|
user: { |
||||||
|
name: "joe", |
||||||
|
member: false, |
||||||
|
hobbies: ["golf", "chess"], |
||||||
|
age: 66, |
||||||
|
}, |
||||||
|
} |
||||||
|
); |
||||||
|
``` |
||||||
|
|
||||||
|
Output |
||||||
|
|
||||||
|
```js |
||||||
|
{ |
||||||
|
type: "object", |
||||||
|
status: "updated", |
||||||
|
diff: [ |
||||||
|
{ |
||||||
|
property: "id", |
||||||
|
previousValue: 54, |
||||||
|
currentValue: 54, |
||||||
|
status: "equal", |
||||||
|
}, |
||||||
|
{ |
||||||
|
property: "user", |
||||||
|
previousValue: { |
||||||
|
name: "joe", |
||||||
|
member: true, |
||||||
|
hobbies: ["golf", "football"], |
||||||
|
age: 66, |
||||||
|
}, |
||||||
|
currentValue: { |
||||||
|
name: "joe", |
||||||
|
member: false, |
||||||
|
hobbies: ["golf", "chess"], |
||||||
|
age: 66, |
||||||
|
}, |
||||||
|
status: "updated", |
||||||
|
subPropertiesDiff: [ |
||||||
|
{ |
||||||
|
name: "name", |
||||||
|
previousValue: "joe", |
||||||
|
currentValue: "joe", |
||||||
|
status: "equal", |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: "member", |
||||||
|
previousValue: true, |
||||||
|
currentValue: false, |
||||||
|
status: "updated", |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: "hobbies", |
||||||
|
previousValue: ["golf", "football"], |
||||||
|
currentValue: ["golf", "chess"], |
||||||
|
status: "updated", |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: "age", |
||||||
|
previousValue: 66, |
||||||
|
currentValue: 66, |
||||||
|
status: "equal", |
||||||
|
}, |
||||||
|
], |
||||||
|
}, |
||||||
|
], |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
List exemple: |
||||||
|
|
||||||
|
`getListDiff()` works with arrays of string, number and objects. |
||||||
|
It doesn't work yet with duplicated values. |
||||||
|
|
||||||
|
Input |
||||||
|
|
||||||
|
```js |
||||||
|
getListDiff( |
||||||
|
["mbappe", "mendes", "verratti", "ruiz"], |
||||||
|
["mbappe", "messi", "ruiz"] |
||||||
|
); |
||||||
|
``` |
||||||
|
|
||||||
|
Output |
||||||
|
|
||||||
|
```js |
||||||
|
{ |
||||||
|
type: "list", |
||||||
|
status: "updated", |
||||||
|
diff: [ |
||||||
|
{ |
||||||
|
value: "mbappe", |
||||||
|
prevIndex: 0, |
||||||
|
newIndex: 0, |
||||||
|
indexDiff: 0, |
||||||
|
status: "equal", |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: "mendes", |
||||||
|
prevIndex: 1, |
||||||
|
newIndex: null, |
||||||
|
indexDiff: null, |
||||||
|
status: "deleted", |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: "verratti", |
||||||
|
prevIndex: 2, |
||||||
|
newIndex: null, |
||||||
|
indexDiff: null, |
||||||
|
status: "deleted", |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: "messi", |
||||||
|
prevIndex: null, |
||||||
|
newIndex: 1, |
||||||
|
indexDiff: null, |
||||||
|
status: "added", |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: "ruiz", |
||||||
|
prevIndex: 3, |
||||||
|
newIndex: 2, |
||||||
|
indexDiff: -1, |
||||||
|
status: "moved", |
||||||
|
}, |
||||||
|
], |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
See tests for more visual examples. |
Loading…
Reference in new issue