본문 바로가기
JavaScript

자주 사용하는 lodash 메서드 정리

by 어느새벽 2025. 5. 30.

✅ 배열 관련 메서드

_.chunk(array, size) 배열을 지정한 크기만큼 나눔
_.compact(array) falsey 값(false, 0, '', null, undefined, NaN) 제거
_.uniq(array) 중복 제거
_.flatten(array) 한 단계 평탄화
_.flattenDeep(array) 깊이 있는 배열을 완전히 평탄화
_.difference(arr1, arr2) arr1에만 있는 값 반환
_.intersection(arr1, arr2) 두 배열의 공통 요소 반환
_.zip(arr1, arr2) 같은 인덱스끼리 묶어서 배열로 만듦

 

 

✅ 객체 관련 메서드

메서드설명
_.get(object, path, defaultValue) 깊은 객체 접근 (예: user.profile.name)
_.set(object, path, value) 깊은 객체에 값 설정
_.has(object, path) 경로에 값이 존재하는지 확인
_.pick(object, [keys]) 특정 키만 추출
_.omit(object, [keys]) 특정 키 제외
_.merge(obj1, obj2) 객체 깊은 병합
_.cloneDeep(value) 깊은 복사

 

✅ 컬렉션(배열/객체) 관련 메서드

메서드설명
_.map(collection, iteratee) 배열/객체 요소를 변환
_.filter(collection, predicate) 조건에 맞는 요소 필터링
_.find(collection, predicate) 첫 번째로 조건에 맞는 요소 반환
_.every(collection, predicate) 모든 요소가 조건을 만족하는지 확인
_.some(collection, predicate) 하나라도 조건 만족하는 요소 있는지 확인
_.orderBy(collection, [keys], [orders]) 다중 기준 정렬 (asc, desc)

✅ 유틸리티 메서드

메서드설명
_.debounce(func, wait) 일정 시간동안 이벤트 연속 호출 제한 (검색창 등)
_.throttle(func, wait) 일정 시간마다 함수 한 번만 실행
_.isEqual(a, b) 깊은 값 비교
_.noop() 아무것도 안 하는 빈 함수
_.times(n, iteratee) n번 반복 실행 (_.times(3, i => console.log(i)))

🔥 추천 세트 (개인적으로 많이 쓰는 것들)

  • _.get / _.set / _.has
  • _.uniq
  • _.cloneDeep
  • _.debounce
  • _.filter / _.find
  • _.orderBy
  • _.isEqual

1. _.get

const user = { profile: { name: 'Alice' } };
_.get(user, 'profile.name'); // → 'Alice'
_.get(user, 'profile.age', 30); // → 30 (기본값)

//안전하게 깊은 객체 속성을 꺼낼 수 있다. 중간 값이 undefined여도 에러가 나지 않음

 

2. _.set

const user = {};
_.set(user, 'profile.name', 'Bob');
console.log(user); // → { profile: { name: 'Bob' } }

//존재하지 않는 깊은 경로도 자동으로 만들어서 값을 설정해줌

 

3. _.has

const obj = { a: { b: 2 } };
_.has(obj, 'a.b'); // → true
_.has(obj, 'a.c'); // → false

//특정 경로에 값이 존재하는지 확인할 수 있다.

 

4. _.cloneDeep

const obj = { a: { b: 1 } };
const copy = _.cloneDeep(obj);
copy.a.b = 2;
console.log(obj.a.b); // → 1 (원본 변경되지 않음)

//깊은 복사. 원본 객체와 완전히 분리된 복사본을 만듦

 

5. _.uniq

_.uniq([1, 2, 2, 3, 3]); // → [1, 2, 3]

//배열의 중복을 제거함

 

6. _.debounce

const onSearch = _.debounce((text) => {
  console.log('API 호출:', text);
}, 300);

// 사용 예시 (입력 이벤트 시)
onSearch('hello'); // 300ms 후 실행

//함수 실행을 일정 시간 동안 지연시켜, 빠른 연속 호출을 막는다.

 

7. _.filter

const users = [
  { name: 'Alice', active: true },
  { name: 'Bob', active: false }
];

_.filter(users, { active: true });
// → [ { name: 'Alice', active: true } ]

//조건에 맞는 요소만 필터링해서 새로운 배열로 반환

 

8. _.find

_.find(users, { active: false });
// → { name: 'Bob', active: false }

//조건에 맞는 첫번째 요소만 반환함

 

9. _.orderBy

const users = [
  { name: 'Charlie', age: 30 },
  { name: 'Alice', age: 25 }
];

_.orderBy(users, ['age'], ['asc']);
// → [ { name: 'Alice' }, { name: 'Charlie' } ]

//배열을 정렬한다. ['asc'] or ['desc']로 방향 설정 가능. 

//여러 키로 정렬도 가능
const users = [
  { name: 'Alice', age: 30 },
  { name: 'Bob', age: 25 },
  { name: 'Charlie', age: 25 },
  { name: 'David', age: 30 }
];

const result = _.orderBy(users, ['age', 'name'], ['asc', 'desc']);
console.log(result);

//result
[
  { name: 'Charlie', age: 25 },
  { name: 'Bob', age: 25 },
  { name: 'David', age: 30 },
  { name: 'Alice', age: 30 }
]

//먼저 age를 오름차순(asc)으로 정렬
//age가 같은 항목끼리는 name을 내림차순(desc)으로 정렬

 

10. _.isEqual

_.isEqual({ a: 1 }, { a: 1 }); // → true
_.isEqual({ a: 1 }, { a: 2 }); // → false

//깊은 값까지 비교함. === 연산로는 비교 불가능한 객체도 정확히 비교 가능

 

11. _.compact

_.compact([0, 1, false, 2, '', 3]);
// → [1, 2, 3]

//falsey 값들(false, 0, '', null, undefined, NaN) 제거

 

12. _.times

_.times(3, i => console.log(i));
// 출력: 0, 1, 2

//N번 반복 실행할 때 사용. 반복 횟수만큼 콜백 실행

 

13. _.pick / _.omit

const user = { name: 'Alice', age: 30, email: 'a@example.com' };

_.pick(user, ['name', 'email']); // → { name: 'Alice', email: 'a@example.com' }
_.omit(user, ['email']); // → { name: 'Alice', age: 30 }

//객체에서 특정 키만 추출하거나 제와할때 사용
반응형