웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
자바스크립트 함수형 프로그래밍을 위한 라이브러리 lodash/fp를 사용하는 경우 배열에 map() 함수 사용시 바로 인덱스를 가져올 수 없는데요... 이 경우 어떻게 하면 index를 가져올 수 있는지 해결 방법에 대하여 알아봅니다.
lodash의 fp 함수는 하나의 인자만 사용하도록 캡이 적용되어 있기 때문에 fp의 map() 함수에서는 두 번째 인자값인 인덱스를 가져올 수 없습니다. 다만 적용된 캡을 제외하는 방법으로 가능한데요 ~ 이 경우 아래와 같이 convert({ cap: false })를 사용하여 해결할 수 있습니다. 먼저 cap을 사용하지 않았을 경우의 코드입니다.
위 예제는 index의 값을 가져올 수 없기 때문에 map() 함수는 undefined 값을 가지는 배열을 반환하게 될 것입니다. 이를 수정하기 위해서 아래에서는 convert({ cap: false })를 적용하여 다시 작성해봅니다.
변경된 코드를 수행할 경우 index 값으로 이루어진 새로운 배열을 반환하게 될 것입니다. 이처럼 간단하게 index 값을 얻을 수 있게 되었습니다.
여기까지 lodash/fp의 map()에서 index를 사용하는 방법을 간략하게 알아봤습니다.
! lodash/fp map() 인덱스 가져오기
lodash의 fp 함수는 하나의 인자만 사용하도록 캡이 적용되어 있기 때문에 fp의 map() 함수에서는 두 번째 인자값인 인덱스를 가져올 수 없습니다. 다만 적용된 캡을 제외하는 방법으로 가능한데요 ~ 이 경우 아래와 같이 convert({ cap: false })를 사용하여 해결할 수 있습니다. 먼저 cap을 사용하지 않았을 경우의 코드입니다.
import fp from 'lodash/fp'
fp.map(
(item, index) => {
return index
}
)
fp.map(
(item, index) => {
return index
}
)
위 예제는 index의 값을 가져올 수 없기 때문에 map() 함수는 undefined 값을 가지는 배열을 반환하게 될 것입니다. 이를 수정하기 위해서 아래에서는 convert({ cap: false })를 적용하여 다시 작성해봅니다.
fp.map.convert({ cap: false })(
(item, index) => {
return index
}
)
(item, index) => {
return index
}
)
변경된 코드를 수행할 경우 index 값으로 이루어진 새로운 배열을 반환하게 될 것입니다. 이처럼 간단하게 index 값을 얻을 수 있게 되었습니다.
여기까지 lodash/fp의 map()에서 index를 사용하는 방법을 간략하게 알아봤습니다.
아래의 글도 찾고 계시지 않나요?