[React] map() if문을 filter로

map()안에서 if문을 사용한 코드

const sample = [{name: "a", age: 22, role: "member", pay: 100},
		{name: "b", age: 25, role: "member", pay: 120},
                {name: "c", age: 30, role: "leader", pay: 130},
               ];
               
const result = sample.map(data => {
	if(data.role !== "leader")
    		return <div>{data.name}</div>;
    }
);

★ filter()를 사용하면 더 깔끔

filter() : 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환

const sample = [{name: "a", age: 22, role: "member", pay: 100},
		{name: "b", age: 25, role: "member", pay: 120},
                {name: "c", age: 30, role: "leader", pay: 130},
               ];
               
const result = sample.filter(data => data.role !== "leader")
	.map(data => {return <div>{data.name}</div>;};
);

 

---

출처 : https://velog.io/@dregonc/map%EC%97%90-if%EB%AC%B8