Class: ListDiffer | egjs::ListDiffer

new eg.ListDiffer(list, findKeyCallback)

A module that checks diff when values are added, removed, or changed in an array.

배열 또는 오브젝트에서 값이 추가되거나 삭제되거나 순서가 변경사항을 체크하는 모듈입니다.

list (default: []) optional

Type: ListFormat<T>

Initializing Data Array.

초기 설정할 데이터 배열.
findKeyCallback optional

Type: (e: T, i: number, arr: T[]) => number | string

This callback function returns the key of the item.

아이템의 키를 반환하는 콜백 함수입니다.

Example

import ListDiffer from "@egjs/list-differ";

// script => eg.ListDiffer

const differ = new ListDiffer([0, 1, 2, 3, 4, 5], e => e);

const result = differ.update([7, 8, 0, 4, 3, 6, 2, 1]);

// List before update

// [1, 2, 3, 4, 5]

console.log(result.prevList);

// Updated list

// [4, 3, 6, 2, 1]

console.log(result.list);

// Index array of values added to list.

// [0, 1, 5]

console.log(result.added);

// Index array of values removed in prevList.

// [5]

console.log(result.removed);

// An array of index pairs of prevList and list with different indexes from prevList and list.

// [[0, 2], [4, 3], [3, 4], [2, 6], [1, 7]]

console.log(result.changed);

// The subset of changed and an array of index pairs that moved data directly. Indicate an array of absolute index pairs of ordered.(Formatted by: Array<[index of prevList, index of list]>)

// [[4, 3], [3, 4], [2, 6]]

console.log(result.pureChanged);

// An array of index pairs to be ordered that can synchronize list before adding data. (Formatted by: Array<[prevIndex, nextIndex]>)

// [[4, 1], [4, 2], [4, 3]]

console.log(result.ordered);

// An array of index pairs of prevList and list that have not been added/removed so data is preserved.

// [[0, 2], [4, 3], [3, 4], [2, 6], [1, 7]]

console.log(result.maintained);

Methods

staticeg.ListDiffer.diff(prevList, list, findKeyCallback){DiffResult<T>} utils.ts, line 50

prevList

Type: T[]

Previous List

이전 목록
list

Type: T[]

List to Update

업데이트 할 목록
findKeyCallback optional

Type: (e: T, i: number, arr: T[]) => any

This callback function returns the key of the item.

아이템의 키를 반환하는 콜백 함수입니다.

Returns:

Type	Description
DiffResult<T>	Returns the diff between `prevList` and `list` `prevList`와 `list`의 다른 점을 반환한다.

Example

import { diff } from "@egjs/list-differ";

// script => eg.ListDiffer.diff

const result = diff([0, 1, 2, 3, 4, 5], [7, 8, 0, 4, 3, 6, 2, 1], e => e);

// List before update

// [1, 2, 3, 4, 5]

console.log(result.prevList);

// Updated list

// [4, 3, 6, 2, 1]

console.log(result.list);

// Index array of values added to list

// [0, 1, 5]

console.log(result.added);

// Index array of values removed in prevList

// [5]

console.log(result.removed);

// An array of index pairs of prevList and list with different indexes from prevList and list

// [[0, 2], [4, 3], [3, 4], [2, 6], [1, 7]]

console.log(result.changed);

// The subset of changed and an array of index pairs that moved data directly. Indicate an array of absolute index pairs of ordered.(Formatted by: Array<[index of prevList, index of list]>)

// [[4, 3], [3, 4], [2, 6]]

console.log(result.pureChanged);

// An array of index pairs to be ordered that can synchronize list before adding data. (Formatted by: Array<[prevIndex, nextIndex]>)

// [[4, 1], [4, 2], [4, 3]]

console.log(result.ordered);

// An array of index pairs of prevList and list that have not been added/removed so data is preserved

// [[0, 2], [4, 3], [3, 4], [2, 6], [1, 7]]

console.log(result.maintained);

update(list){DiffResult<T>} ListDiffer.ts, line 61

Update list.

리스트를 업데이트를 합니다.

list

Type: ListFormat<T>

List to update

업데이트할 리스트

Returns:

Type	Description
DiffResult<T>	Returns the results of an update from `prevList` to `list`. `prevList`에서 `list`로 업데이트한 결과를 반환한다.

Type Definitions

eg.ListDiffer.DiffResultTSInterface

Properties:

Name	Type	Description
`prevList`	T[]	List before update 업데이트하기 전 데이터
`list`	T[]	Updated list 업데이트하는 데이터
`added`	number[]	Index array of values added to `list` `list`에서 추가되는 데이터의 인덱스 배열
`removed`	number[]	Index array of values removed in `prevList` `prevList`에서 제거되는 데이터의 인덱스 배열
`changed`	number[][]	An array of index pairs of `prevList` and `list` with different indexes from `prevList` and `list` 이전 리스트`prevList`와 지금 리스트`list`에서 위치가 다른 `prevList`와 `list`의 인덱스 배열들
`ordered`	number[][]	An array of index pairs to be `ordered` that can synchronize `list` before adding data. (Formatted by: Array<[prevIndex, nextIndex]>) 데이터를 추가하기 전 `list`를 동기화할 수 있는 정렬되는 인덱스 배열들(형태: Array<[이전 인덱스, 다음 인덱스]>)
`pureChanged`	number[][]	The subset of `changed` and an array of index pairs that moved data directly. Indicate an array of absolute index pairs of `ordered`.(Formatted by: Array<[index of prevList, index of list]>) `changed`의 부분집합으로 데이터를 추가하기 전 직접 움직이는 데이터의 인덱스 배열들. `ordered`의 절대적인 인덱스 배열들을 나타내기도 한다. (형태: Array<[prevList인덱스, list인덱스]>)
`maintained`	number[][]	An array of index pairs of `prevList` and `list` that have not been added/removed so data is preserved 추가/삭제 되지 않아 데이터가 보존된 `prevList`와 `list`의 인덱스 배열들