[React Native/RN] lodash의 다양한 함수들 사용하기 (debounce(), chunk(), shuffle() 등...)

이전글

👉🏻[React Native/RN] lodash 사용하기 (findIndex(), flatten(), remove() 사용해보기)

[React Native/RN] lodash 사용하기 (findIndex(), flatten(), remove() 사용해보기)

 

 

 

 

debounce() 함수

debounce() 함수는 입력받은 함수를 주어진 시간만큼 대기시켜 실행한다. 대기 시간 동안 추가적인 입력이 없을 경우에만 입력된 함수를 실행한다.

 

import { debounce } from 'lodash';

function handleSearch(query) {
  console.log('searching for', query);
}

// debounce() 함수를 사용하여 1500ms 후에 handleSearch() 함수를 실행
const searchDebounced = debounce(handleSearch, 1500);


const startDebounc = () => {
  searchDebounced('query');
};

 

 

chunk() 함수

chunk() 함수는 배열을 주어진 크기만큼 쪼개어 2차원 배열로 반환한다.

 

import { chunk } from 'lodash';

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

// 3개씩 쪼개어 2차원 배열로 만든다.
const result = chunk(numbers, 3);

console.log(result); // [[1, 2, 3], [4, 5, 6], [7, 8, 9]]

 

 

shuffle() 함수

shuffle() 함수는 배열을 무작위로 섞은 새로운 배열을 반환한다.

 

import { shuffle } from 'lodash';

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

// 배열을 무작위로 섞음
const result = shuffle(numbers);

console.log(result); // [3, 9, 1, 5, 8, 2, 7, 6, 4]

 

 

range() 함수

range() 함수는 시작점과 끝점을 지정하여 그 사이의 숫자 배열을 생성한다.

 

import { range } from 'lodash';

// 1부터 5까지의 숫자 배열을 생성
const result = range(1, 6);

console.log(result); // [1, 2, 3, 4, 5]

 

 

first() 함수

first() 함수는 배열의 첫 번째 값을 반환한다.

 

import { first } from 'lodash';

const numbers = [1, 2, 3, 4, 5];

// 배열의 첫 번째 값을 반환
const result = first(numbers);

console.log(result); // 1

 

 

last() 함수

last() 함수는 배열의 마지막 값을 반환한다.

 

import { last } from 'lodash';

const arr = [1, 2, 3, 4, 5];
const lastElement = last(arr);
console.log(lastElement); // 5

 

 

take() 함수

take() 함수는 배열의 첫 번째 요소부터 n개의 요소를 반환한다.

 

import { take } from 'lodash';

const arr = [1, 2, 3, 4, 5];
const takenElements = take(arr, 3);
console.log(takenElements); // [1, 2, 3]

 

isEqual() 함수

isEqual() 함수는 두 값이 얕게나마 같은지 비교한다.

 

import { isEqual } from 'lodash';

console.log(isEqual(1, 1)); // true
console.log(isEqual({a: 1, b: 2}, {a: 1, b: 2})); // true
console.log(isEqual([1, 2, 3], [1, 2, 3])); // true

 

 

includes() 함수

includes() 함수는 배열에 특정 값이 포함되어 있는지 확인한다.

 

import { includes } from 'lodash';

const arr = [1, 2, 3, 4, 5];
console.log(includes(arr, 3)); // true
console.log(includes(arr, 6)); // false