TIL | 튜터님의 메소드연기(return, break, continue)

[250120 월요일]

리액트 반을 정하기 전 고민이 많았다. 과제를 하면서 강의를 듣고 실습을하고 특강까지 하려니 생각보다 시간이 많이 부족했다. 친구와 고민고민 하던중에 튜터님이 지나가셨다. 도움을 요청! 아앗.. 프로 강태공 튜터님!!
지난주에 있었던 부분임에도 아직도 기억에 남는
return과 break, continue!!!

배열관련 문제풀이를 하다 다른 수강생과 튜터님까지 낚아버린 연기에 다들 혼이 쏙~!

🛸 array.filter

배열에 사용하는 메소드이며, 조건에 맞아 참인 경우만 골라낼 때 사용한다.

const originalList = [
  { id: 1, name: "상품1", price: 1000 },
  { id: 2, name: "상품2", price: 2000 },
  { id: 3, name: "상품3", price: 3000 },
];
//
//printRemovedProduct : id가 1인 상품을 제거하고 출력.
//
function printRemovedProduct(productList) {
  const removedProduct = productList.filter(function (product) {
    return product.id !== 1;
  });
  console.log(removedProduct);
}

filter를 이용해서 문제는 잘 풀었고, 반복문을 사용하여 푸는 과정에 대해서 질문이 있어서 반복문을 사용하여 풀던중...

🛸 어? 이게 왜 안돼지?

동일한 문제를 for문을 이용하여 풀던중이었다.
분반수업 마지막 날로 화면해설 중이어서 다른조에 있던 분들도 같이 풀이화면 보던중...

function printRemovedProduct(productList) {
  const removedProduct = [];

  for (let i = 0; i < productList.length; i++) {
    const product = productList[i];

    if (product.id === 1) {
      return;
    } else {
      removedProduct.push(product);
    }
  }
  console.log(removedProduct); 
}

어? 값이 안나오는 것이다.. 이상하다? 맞는것 같은데??
튜터님도 이상하다는 표정과 뉘앙스... "여러분 왜안될까요?"
다들 고민...다른조 튜터님도 같이 문제풀이 보고 계셨는데,

"함수 호출 되었나요?" 하고 물어보니,

printRemovedProduct(originalList);

함수 호출은 잘 되어 있던 상황.

콘솔 로그를 for문 안에다 두고 다시 실행.
튜터님이 뭔가 일부러 여러번 실행을 확인하는 느낌적인 느낌!

터미널에는
'왜 실행이 안돼?'만 반복.

누군가 "else 다음에 리턴이 없어요" 라고했다.

튜터님이 "어, 그러네요~ 근데 없어도 되요~"
그러면서 다시 콘솔로그를 출력..

다른 의견들이 안나오자 if문 아래쪽 return으로 커서를 슬~쩍 옮기더니
"여러분 여기 retrun이 있으면 어떻게 되죠? 함수가 여기서 끝나죠? 만약에 반복문을 멈추고 싶다면 break를 쓰면되고, 우리는 id가 1인상품을 건너 뛰어야 하니까 여기선 countinue를 써야겠죠?

대문자 I.T.성향인 튜터님이 감정기복없이 너무 자연스러운 상황이라 수강생들도 낚였고 다른 튜터님도 낚였다....

콘솔로그를 계속 실행하면서 출력을 했던 이유가 이거였다...
반복문에 콘솔로그를 실행하는데 1회밖에 출력이 안되다니...!!

덕분에 이론으로는 알고 있었지만 딱시 활용방법등이 생각나지 않았던 반복문의 break와 continue, 그리고 다시한번 상기한 return의 기능을 잊지는 않을 것같다!!

이제 됨!

그래서 continue를 사용하는 정상작동하는 코드는 아래와 같다.

function printRemovedProduct(productList) {
  const removedProduct = [];
  for (let i = 0; i < productList.length; i++) {
    const product = productList[i];
    if (product.id === 1) {
      continue;
    } else {
      removedProduct.push(product);
    }
  }
  console.log(removedProduct); 
}

id가 1인 제품은 제외하고
정상적으로 출력된다.!!