웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리

HOME > lodash

lodash find() 객체 값 찾기

Last Modified : 2022-12-22 / Created : 2018-07-28
22,310
View Count
lodash의 find()에 대하여 알아봅니다.




# lodash _.find() 알아보기

먼저 find()에 대하여 알아봅니다. find()원하는 값을 배열 / 객체에서 쉽게 찾아 사용할 수 있습니다. 배열의 경우 비교적 간단하게 원하는 값을 찾을 수 있지만 객체의 경우는 어떤가요? 뭔가 일치하는 값을 찾으려면 변환에 변환을 거치고 어렵게 원하는 값을 구할 수 있습니다. 하지만 find()를 사용하면 여러 값을 가지는 데이터에 대하여 매우 간단하게 원하는 값을 찾는 것이 가능합니다. 먼저 아래는 문법입니다.

_.find(collection, [찾을 조건])
_.find(collection, {찾을 조건})


찾을 Collection 대상에서 찾을 조건을 넘겨줘야 하는데 객체 / 배열 모두 가능합니다. 그렇다면 아래에서 예제를 통하여 어떻게 사용하는지 알아보도록 하죠.



# lodash _.find() 예제보기

먼저 예제로 하나의 sites라는 변수에 collection을 임의로 만들어봅니다.
var sites = [
  { no: 1, name: 'web', type: 'a' },
  { no: 2, name: 'is', type: 'b' },
  { no: 3, name: 'free', type: 'c' }
];

만약 위 값에서 no가 2인 데이터의 값인 객체를 가져오려면 어떻게 할까요? lodash를 사용하지 않는다면 찾기 위해 여러 과정을 거쳐야하며 성능 이슈도 고려해야합니다. 하지만 lodash의 find()를 사용하면 매우 간단합니다. 아래를 봐주세요.
 _.find(sites, {'no': 2});

위 코드를 실행하면 우리가 찾는 no가 2인 객체를 반환하게 됩니다.
{no: 2, name: "is", type: "b"}


! 여러 개의 값이 일치하여 배열로 받아야 하는 경우

만약 여러 개가 일치하는 경우라면? 이 경우 하나의 값이 아닌 배열로 리턴되어야 합니다. 즉 이 경우는 이때는 _.filter()를 사용해야 합니다.
var sites = [
  { no: 1, name: 'web', type: 'a' },
  { no: 2, name: 'is', type: 'b' },
  { no: 3, name: 'free', type: 'b' }
  { no: 4, name: 'com', type: 'c' }
];

아래와 같이 가져올 수 있습니다.
 _.filter(sites, { type: 'b' });

{ no: 2, name: 'is', type: 'b' },
{ no: 3, name: 'free', type: 'b' }



! 복수 조건을 설정하여 찾는 방법

이번에는 두 개 이상의 조건을 사용하여 객체를 찾아보겠습니다. no가 2이면서 동시에 type값이 b인 값을 찾는다면 아래와 같이 명령어를 입력합니다.
_.find(sites, {'no': 2, 'type': 'b'});

반환결과 예상대로 원하는 데이터를 찾아서 객체를 반환합니다.
{no: 2, name: "is", type: "b"}


! 배열 방식으로 찾는 방법

배열방식으로 찾는 것도 가능합니다. 만약 type 프로퍼티가 'c'인 값을 찾는다면 아래처럼 배열의 순서대로 'type'과 'c'를 입력합니다.
_.find(sites, ['type', 'c']);

이처럼 배열을 사용하여 원하는 값을 찾을 수 있습니다.


! 함수를 적용하는 방법

find()에도 찾을 조건에 함수를 적용할 수 있습니다. 만약 no가 2인 값을 찾는 경우 아래처럼 함수를 인자로 넘겨서 찾을 수 있죠.
_.find(sites, function(site) {
  return site.no === 2 }
);

이처럼 함수를 사용하면 더 복잡한 다양한 조건을 설정하는 것이 가능합니다.



# 마치면서

여기까지 Collection에서 원하는 값을 쉽게 찾을 수 있는 lodash .find()에 대하여 알아보았습니다. 이처럼 lodash를 잘 사용하면 복잡한 코드를 쉽게 작성할 수 있습니다.

Previous

lodash isEmpty() 정보 및 예제

Previous

lodash find()에서 AND, OR 조건으로 찾기