웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
lodash 메소드 중 하나는 fromPairs()에 대하여 알아봅니다.
이름처럼 fromPairs()는 pair의 사전적 의미인 한 쌍과 같이 하나의 쌍을 이루는 값으로부터 객체를 생성하는 메소드입니다. 즉 pair가 되는 두 개의 값 key와 value를 가지고 있어야 하겠죠. 예를들어 key와 value로 이루어진 배열에서 객체를 얻을 때 fromPairs()를 사용하면 쉽게 객체로 변환할 수 있겠죠.
다음으로 문법입니다. 사용방법은 매우 간단합니다.
_.fromPairs(pair)
pair // key, value로 이루어진 배열 값
이제 몇 가지 예제를 알아봅니다.
예제 1)
예제 2)
예제 3)
만약 배열의 value 값으로 객체를 가지면 어떻게 될까요?
아래의 결과를 보면 객체가 사용해도 문제없이 동일하게 동작합니다. 즉 value의 값으로 원시값이나 참조값 모두 사용 가능합니다.
예제 4)
만약 값이 하나 하나라 [] 기호를 생략해서 하나만 써도 될까요? 아래 예제처럼 말이죠.
결과를 보면 값이 모두 undefined로 나타납니다. 즉 배열 각각의 값을 하나의 pair로 인식하기 때문에 value가 없는 key만 가진 객체로 결과를 반환하게 됩니다.
여기까지 lodash 메소드 fromPairs()에 대하여 알아보았습니다.
추가로 lodash에는 fromPairs() 처럼 동작하는 메소드가 존재하는데요 바로 toPairs()입니다. 사실 toPairs()는 fromPairs()와는 완전히 반대로 동작하는 메소드입니다. 즉 배열에서 객체를 생성하는게 아닌 객체에서 배열을 생성합니다.
생각해보니 배열의 내장 메소드에도 비슷한 메소드가 존재하죠? 바로 Object.entries()입니다. 코드를 살펴볼까요?
두 가지 방법 모두 알아두면 좋겠습니다.
# lodash 메소드 fromPairs()
이름처럼 fromPairs()는 pair의 사전적 의미인 한 쌍과 같이 하나의 쌍을 이루는 값으로부터 객체를 생성하는 메소드입니다. 즉 pair가 되는 두 개의 값 key와 value를 가지고 있어야 하겠죠. 예를들어 key와 value로 이루어진 배열에서 객체를 얻을 때 fromPairs()를 사용하면 쉽게 객체로 변환할 수 있겠죠.
다음으로 문법입니다. 사용방법은 매우 간단합니다.
_.fromPairs(pair)
pair // key, value로 이루어진 배열 값
이제 몇 가지 예제를 알아봅니다.
예제 1)
myArray = [[ 'a', 1 ], ['b', 2], ['c', 3]]
myObj = _.fromPairs(myArray)
// Result
{
a: 1,
b: 2,
c: 3
}
myObj = _.fromPairs(myArray)
// Result
{
a: 1,
b: 2,
c: 3
}
예제 2)
myArray = [[ 'no', 1 ], ['sitename', '웹이즈프리'], ['url', 'webisfree.com']]
myObj = _.fromPairs(myArray)
// Result
{
no: 1,
sitename: '웹이즈프리',
url: 'webisfree.com'
}
myObj = _.fromPairs(myArray)
// Result
{
no: 1,
sitename: '웹이즈프리',
url: 'webisfree.com'
}
예제 3)
만약 배열의 value 값으로 객체를 가지면 어떻게 될까요?
myArray = [[ 'a', {'aa': '2 depths'} ]]
myArray2 = [[ 'a', {'aa': { 'aaa': '3 depths'} } ]]
myObj = _.fromPairs(myArray)
myObj2 = _.fromPairs(myArray2)
myArray2 = [[ 'a', {'aa': { 'aaa': '3 depths'} } ]]
myObj = _.fromPairs(myArray)
myObj2 = _.fromPairs(myArray2)
아래의 결과를 보면 객체가 사용해도 문제없이 동일하게 동작합니다. 즉 value의 값으로 원시값이나 참조값 모두 사용 가능합니다.
// Result
{
a: {
aa: '2 depths'
}
}
{
a: {
aa: {
'3 depths'
}
}
}
{
a: {
aa: '2 depths'
}
}
{
a: {
aa: {
'3 depths'
}
}
}
예제 4)
만약 값이 하나 하나라 [] 기호를 생략해서 하나만 써도 될까요? 아래 예제처럼 말이죠.
myArray = [ 'a', '1' ]
myObj = _.fromPairs(myArray)
// Result
{
1: undefined,
a: undefined
}
myObj = _.fromPairs(myArray)
// Result
{
1: undefined,
a: undefined
}
결과를 보면 값이 모두 undefined로 나타납니다. 즉 배열 각각의 값을 하나의 pair로 인식하기 때문에 value가 없는 key만 가진 객체로 결과를 반환하게 됩니다.
여기까지 lodash 메소드 fromPairs()에 대하여 알아보았습니다.
! 팁 및 정보
추가로 lodash에는 fromPairs() 처럼 동작하는 메소드가 존재하는데요 바로 toPairs()입니다. 사실 toPairs()는 fromPairs()와는 완전히 반대로 동작하는 메소드입니다. 즉 배열에서 객체를 생성하는게 아닌 객체에서 배열을 생성합니다.
생각해보니 배열의 내장 메소드에도 비슷한 메소드가 존재하죠? 바로 Object.entries()입니다. 코드를 살펴볼까요?
myArray = Object.entries({a: 1, b: 2, c: 3})
myObj = _.fromPairs(myArray)
// Result
{ a: 1, b: 2, c: 3 }
myObj = _.fromPairs(myArray)
// Result
{ a: 1, b: 2, c: 3 }
두 가지 방법 모두 알아두면 좋겠습니다.
[lodash] omitBy() 알아보기
