[JavaScript] 배열 중복 제거

7월 11일 업무 중 학습한 내용 

 

⚠️ 이슈 : 지점관리 > 코칭클래스의 리스트를 렌더링하는 과정에서 클래스가 중복되어 반환되는 현상 발생

✔️ 문제 이해 : 최소번호가 1번이고 최대번호가 11번이면 11개를 응답으로 받는데 courseId가 서버에서 여러개 반환

✅ 해결 : forEach를 사용하여 중복 제거

 

백엔드 API수정 요청을 할 수 있으나 .. 백엔드분이 너무 바빠보이시기도 하고 프론트에서 중복처리로 할 수 있겠다 싶어 해보았다. 

 

console.log("코칭클래스",obj)
              // res = obj;

              const setObj=[];
              const courseIdSet = new Set();
              obj.forEach((item)=>{
                if (!courseIdSet.has(item.courseId)){
                  courseIdSet.add(item.courseId);
                  setObj.push(item);
                }
              })
              console.log('중복처리 : ', setObj)

              res = setObj;

setObj라는 새로운 배열을 만들어 받아온 obj에 대해 중복을 확인하고 넣어주면 중복 처리 삽가능 ~ 

다른 함수도 있었지만 obj 배열을 구성하는 객체가 조금 복잡한지라.. 이게 제일 효과적이었다. 

 

---

다른 중복제거 방법으로는
- Set함수 
- indexOf(), filter()
- includes()
등이 있다. 

 

링크 참고하시길 ~