evtSprtrList?.flatMap(sp => sp.lowEvtSprtrList);
주어진 JavaScript 코드 evtSprtrList?.flatMap(sp => sp.lowEvtSprtrList);는 evtSprtrList 배열이 정의되어 있고 null이 아닌 경우 각 요소의 lowEvtSprtrList 속성을 추출하고 이를 하나의 배열로 평탄화(flatten)하는 작업을 수행합니다.
이 작업을 설명하고자 할 때, 아래와 같은 예시와 함께 단계별로 설명해 보겠습니다:
예시 데이터
const evtSprtrList = [
{
id: 1,
lowEvtSprtrList: [10, 20, 30]
},
{
id: 2,
lowEvtSprtrList: [40, 50]
},
{
id: 3,
lowEvtSprtrList: [60]
}
];
코드 설명
flatMap 메서드는 배열의 각 요소에 대해 주어진 콜백 함수를 호출하고, 그 결과를 평탄화하여 단일 배열로 만듭니다.
단계별 설명
- Optional Chaining (?.) 사용:
- evtSprtrList가 null 또는 undefined일 때, flatMap 메서드를 호출하지 않고 undefined를 반환하여 이후의 오류를 방지합니다.
- flatMap 메서드:
- flatMap 메서드는 배열의 각 요소에 대해 콜백 함수를 호출한 후 결과를 하나의 배열로 결합합니다.
- sp => sp.lowEvtSprtrList 콜백 함수는 각 요소(sp)의 lowEvtSprtrList 속성을 반환합니다.
동작 설명
위의 예시 데이터와 함께 코드를 실행하면 다음과 같은 단계를 거칩니다:
const flattenedList = evtSprtrList?.flatMap(sp => sp.lowEvtSprtrList);
console.log(flattenedList); // 출력: [10, 20, 30, 40, 50, 60]
결과
flatMap은 각 lowEvtSprtrList 배열을 추출하고 이를 하나의 배열로 평탄화하여 [10, 20, 30, 40, 50, 60] 결과를 반환합니다.
따라서, 주어진 코드는 evtSprtrList 배열이 존재하는 경우 각 요소의 lowEvtSprtrList 속성 값들을 결합한 단일 배열을 생성합니다. evtSprtrList가 null 또는 undefined일 경우 undefined를 반환합니다.
연관된 글 :
[개발/Java] - [Java] Stream API - map과 flatMap
참고:
'개발 > front-end' 카테고리의 다른 글
[JavaScript] scroll 이벤트로 특정영역 도달시 function 호출 (0) | 2024.06.09 |
---|---|
Thymeleaf (1) | 2024.06.06 |
모노레포(Monorepo) (0) | 2023.04.23 |
프론트엔드 공부하기 (0) | 2023.03.16 |
jQuery API (0) | 2019.04.16 |