제어문 (Control Flow) - 1

Sinf·2021년 11월 23일
0

javascript

목록 보기
5/10
post-thumbnail

제어문 (Control Flow)

코드를 구성하다보면 특정 조건에서 발생하도록 유도하는 조건문, 반복되는 문장을 쉽게 반복할 수 있는 반복문과 같은 제어문들이 필요하다.

조건문

if

자바스크립트에서 조건문의 사용은 if를 통해 사용할 수 있다.

if (조건) {
  // 조건이 참(true)일 경우 실행할 내용
}

위와 같은 형태로 사용할 수 있다. 조건의 경우 결과가 참(true) 혹은 거짓(false)로 나오는 것을 사용할 수 있다. 조건의 결과가 참(true)일 때만 {}내부의 코드가 실행된다.

if (id === 'admin') {
  alert('Welcome')
}

idadmin일 경우에 Welcome이라는 알림창을 띄우는 코드다.

if의 결과가 거짓일 경우는 어떻게 처리해야 할까?
else를 사용하자!

if ~ else

if (조건) {
  // 조건이 참일 경우 실행
} else {
  // 조건이 거짓일 경우 실행
}

조건이 거짓일 경우에 실행할 문장을 else의 블록 안에 넣어주면 된다.

if (id === 'admin') {
  alert('Welcome')
} else {
  alert('너는 누구냐')
}

admin이 아닌 다른 사람일 때, 너는 누구냐라는 알림창이 뜨도록 한다.

또,
admin이 아닌데, 아예 모르는 사람이 아닌 경우는 어떻게 할까?
else if를 사용한다.

if ~ else if ~ else

if (조건1) {
  // 조건1이 참일 경우 실행
} else if (조건2) {
	// 조건2가 참일 경우 실행
} else {
  // 조건1, 조건2가 거짓일 경우 실행
}

else if에 또 다른 조건을 넣어줄 수 있다.

if (id === 'admin') {
  alert('Welcome')
} else if (id === 'tommy'{
  alert('Hi, tom')
} else {
  alert('너는 누구냐')
}

admin은 아니지만, tommy인 경우 Hi, tom이라는 알림창이 뜨도록 한다.

else if의 경우 ifelse 사이에 여러개를 사용할 수 있다. (많이 사용할 수 있지만, 아마 더 복잡해지지 않을까...?)

조건에 대해서 잘 정의한다면,
조건에 따라 원하는 값을 실행할 수 있다.

switch

ifelse 사이에 많은 else if가 겹치다보면 코드가 점점 더 읽기 어려워질 것이다. 만약 위의 예시와 같이 비교하는 값이 id와 같이 정해진 타입이 넣어지는 경우 더 간단하게 만들고 싶어진다.

switch를 사용해보자.
(모든 경우를 switch로 대체할 순 없을 것이다. 하지만, 가능한 경우 더 간단하게 바꿀 수 있을 것이다.)

switch(변수) {
  case:
    // 변수 == 값일 경우 진행
    break;
  case2:
    // 변수 == 값2일 경우 진행
    break;
  default:
    // 값, 값2도 아닐 때 진행
}

형태로만 봐서는 와닿지 않는다. 위의 예시로 다시 보자.

switch(id) {
  case 'admin':
    alert('Welcome');
    break;
  case 'tommy':
    alert('Hi, Tommy');
    break;
  default:
    alert('너는 누구냐');
}

이렇게 작성할 경우 if를 사용한 문장과 동일한 결과를 출력한다. switch의 경우 전달된 파라미터와 맞는 케이스를 찾아 실행한다. default의 경우 else와 비슷하다.

break는 뭐지?
switch의 경우 맞는 케이스를 찾고, 그 아래로 모든 코드를 실행한다.

switch(id) {
  case 'admin':
    alert('Welcome');
  case 'tommy':
    alert('Hi, Tommy');
  default:
    alert('너는 누구냐');
}

break가 없이 idadmin인 경우 실행하면, Welcome부터 너는 누구냐까지 모두 실행된다. 중간에 break를 사용해 끊어주는 것이다.

잘만 사용하면, 상위에 정의된 케이스에 하위에 정의된 케이스의 구문까지 실행할 수 있도록 유도할 수 있다.

결론

조건문은 조건에 따라 실행한다.
if, else, else if, switch, case를 사용한다.

profile
주니어 개발자입니다. 🚀

0개의 댓글