Javascript 제어문

소재현·2022년 7월 1일
0

JavaScript

목록 보기
4/4
post-thumbnail

제어문

if문

  • if문은 if라는 키워드를 쓰고 뒤에 소괄호를 열어서 조건 부분을 작성한 다음 중괄호를 또 열어서 동작 부분을 작성한다 만약 조건부분이 충족되면 동작 부분을수행해라 라는 의미이다
  • 조건에 맞지않는 경우에 혹시나 어떤 동작을 또 다루고 싶을 때는 '그렇지않으면'이라는 뜻을가진 else라는 키워드를 사용하면된다


규원이가 타고 싶어하는 롤러코스터의 키 제한은 140cm 이상입니다. 그럼 자연스럽게 이 조건이 if문의 조건 부분에 들어가야 하겠죠?

일단 if문의 기본 구조는 다음과 같습니다.

if (조건) {
동작;
}

그러면 조건 부분에는 140cm 이상이 들어가야 하니 다음과 같이 작성할 수 있습니다.

// 파라미터 height을 활용하는 checkHeight 함수를 완성하세요.
function checkHeight(height) {
if (height >= 140) {
 
 }
 }

이제 동작 부분을 작성하면 되는데요. 문제에서 출력 예시를 살펴보면, 출력되는 유형이 탑승이 가능합니다.와 탑승이 불가능합니다. 두 가지가 있는 걸 확인할 수 있죠? 위에서 조건 부분을 140 이상으로 작성했으니, 이 조건에 맞는 동작은 아무래도 탑승이 가능합니다.가 들어가는 게 좋겠습니다.

// 파라미터 height을 활용하는 checkHeight 함수를 완성하세요.
function checkHeight(height) {
if (height >= 140) {
console.log('탑승이 가능합니다.');
}
}

이렇게 하면, 다음으로 조건 부분이 충족되지 않을 때 탑승이 불가능합니다.라는 메시지를 출력해야 하는 데요. 조건 부분이 충족되지 않을 때의 동작은 else문을 사용하면 됩니다. else문의 기본 구조는 다음과 같습니다.

if (조건) {
동작;
} else {
동작; // 조건이 충족되지 않을 때
}


// 파라미터 height을 활용하는 checkHeight 함수를 완성하세요.
function checkHeight(height) {
if (height >= 140) {
console.log('탑승이 가능합니다.');
} else {
console.log('탑승이 불가능합니다.');
}
}

이렇게 코드를 완성하면, 과제에서 요구하는 결과가 무리 없이 잘 출력됩니다 :)

탑승이 가능합니다.
탑승이 불가능합니다.
탑승이 가능합니다.

그런데 여기서 조금만 더 팁을 드리자면, 키 제한 값이나 출력메시지 값과 같이 직접적으로 작성되는 값은 변수로 추상화 하는 것이 가독성과 유지보수 측면에서 좀 더 좋은데요.

// 파라미터 height을 활용하는 checkHeight 함수를 완성하세요.
function checkHeight(height) {
const LIMIT = 140;
let passMessage = '탑승이 가능합니다.';
let failMessage = '탑승이 불가능합니다.';

if (height >= LIMIT) {
console.log(passMessage);
} else {
console.log(failMessage);
}
}

위 코드를 보면 비록 코드는 길어졌지만, 각 값들의 의미를 부여하기 때문에 다른 사람들에게 보여주거나 혹은 내가 이 코드를 다시 보게 될 때도 좀 더 이해하기 편한 코드가 될 수 있습니다.

그리고 혹여나 제한 키의 값을 수정하거나 출력 메시지를 수정할 때도, 이렇게 한곳에 모여있는 변수 값들을 변경할 수 있으면 if문 안에서 하나하나 찾아서 수정하는 것보다는 상대적으로 더 편리하게 수정하다

else if문

  • if문이 중첩될 때 else다음 if문이 바로 이어지는 경우에는 else if문이라는걸 활용할수 있다 또한 else if문을 사용함으로써 가독성 또한 높일수있다

이런식으로 else if문을 사용할수있다

💥꿀팁💥

command + d를 누르면 똑같은 코드를 동시에 선택할 수 있다

switch문

  • swich문 어떤 대상과 조건값이 일치하는지를 확인하고 그결과에 따라 다른동작이 필요할때는 swith문을 활용할수 있다
  • 💥한 가지 주의할 점은 조건식에서 등호를 반드시 3개를 입력해 주어야 한다는 점인데요. switch문은 암시적 형 변환을 허용하지 않기 때문입니다.

이런 식으로 switch문을 사용할 수 있다

for문

for 반복문은 어떤 특정 조건을 불충족할때까지 반복한다
참고:https://goddaehee.tistory.com/227

for문 주의할점


이런식으로 for문을 활용할 수 있다

while문

  • while문과 for문은 대부분 서로 대체가 가능하다
  • 글로벌 변수를 조건비교하여 사용하고 반복문 내부에서도 다루면서 결과적으로 반복문이 종료된 다음에도 이변수를 사용해야 될 때는 for문 보다 while문을 활용하는 것이 더 좋다

while문을 이런식으로 활용할 수 있다

break와 continue

  • break는 반복문에 조건 부분과 상관없이 반복이 실행되는 도중에 빠져나갈 수 있다

  • continue는 동작 부분을 한번 건너뛰는 것이다 다시말해 continue를 만나게 되면 그 아래 코드들은 실행 되지 않고 바로 다음단계로 넘어가는것이다

느낀점

프로그램 핵심 개념 3가지 자료형,추상화,제어문을 마무리 하였다 생각보다 하면 할 수록 더 어려워지는거 같다 응용문제를 해결할때 시간이 좀 걸리기도하고 힌트를 보기도 했지만 무사히 마무리를 하였다 요즘 나스스로 나태해진거 같아서 다음주부턴 노마드 코더에 바닐라js,코코아 클론 챌린지를 시작하기로 했다 2주동안의 과정인데 부트캠프 가기전까지 두가지 챌린지를 모두 경험하고 가면 좋을꺼같아서 신청하게되었는데 사실 설레기보단 두려움,,, 스스로 나를 좀더 나태해지지않도록 노력해야겠다!! 담주부턴 더 화이팅~~

0개의 댓글