제로초 JavaScript 강의 - 조건부 연산자(삼항 연산자), 반복문 while

 

• 제로초 JavaScript 강의 - 조건부 연산자(삼항 연산자), 반복문 while 

---

Review

 

 

 제로초님 만세 !!!!!

내가 이때까지 듣고 싶었던 강의를 드디어 찾은 것 같다. 솔직히 재밌기만 하다면 거짓말이지만

진짜 너무 자세히 알려주셔서 문과 나부랭이가 더 흥미를 가질 수 있게 해주신다.

정말 기본기를 탄탄히 다질 수 있도록 수업해주신다. 똑똑한 분...

너무너무 감사합니당 학원에 가지말고 인강들으면서 공부할 걸 그랬나 싶은 생각이 요즘 문득

문득 든다. 그렇지만 이제부터라도 열심히 기본기를 다져서 취업해야지 !

 

파이팅 !!!

 

 

 

 

---

 

• 제로초 JavaScript 강의 - 조건부 연산자(삼항 연산자), 반복문 while 

 

 

<조건부 연산자(삼항 연산자)>

 

 

: if 문과 switch 문 외에도 분기 처리에 사용하는 식이 있다. 이는 조건부 연산자 또는 삼항 연산자라고

하는 연산자로 표현한다.

 

조건식 ? 참일 때 실행되는 식 : 거짓일 때 실행되는 식

 

조건부 연산자는 문이 아니라 식이므로 결괏값이 나온다. 이번에는 다음 코드를 입력해보자.

 

> 5 > 0 ? '참입니다' : '거짓입니다';
< "참입니다"

 

> 연산자의 우선순위가 조건부 연산자의 우선순위보다 높으므로 5 > 0이 먼저 실행되고,

이것이 조건식이 된다. 5 > 0은 true이므로 ‘참입니다’가 결괏값으로 출력된다.

조건부 연산은 조건에 따라 달라지는 값을 변수에 대입할 때 사용한다.

 

> let value = 5 < 0 ? '참입니다' : '거짓입니다';
< undefined
> value;
< "거짓입니다"

 

대입 연산자의 우선순위가 가장 낮기 때문에 조건부 연산의 결괏값인 ‘거짓입니다’가 

value 변수에 대입된다.

 

 

switch 문을 if 문으로 바꿀 수 있는 것처럼 조건부 연산도 if 문으로 변경할 수 있다.

 

> let condition = true;
  let value = condition ? '참' : '거짓';
  console.log(value);

  if (condition) {
    value = '참';
  } else {
    value = '거짓';
  }
  console.log(value);

  참
  참

 

if 문보다 조건부 연산이 훨씬 짧다. 이렇듯 조건부 연산은 조건문에서 대입하는 부분을 짧게

줄이기 위해 사용한다. 조건부 연산도 중첩해서 사용할 수 있다.

 

> let condition1 = true;
  let condition2 = false;
  let value = condition1 ? condition2 ? '둘 다 참' : 'condition1만 참' : 'condition1이 거짓';
  console.log(value);

  condition1만 참

 

condition1과 condition2 변수의 값을 바꿔 가면서 테스트해 보길 바란다.

조건부 연산이 중첩된 경우에는 넘어가는 순서를 잘 파악해야 한다.

 

중첩된 조건부 연산 순서

 

조건부 연산자를 두 번 연이어 썼더니 가독성이 떨어진다.

이럴 때는 좀 더 읽기 편하게 소괄호 연산자로 감싸주면 좋다.

 

 

let value = condition1 ? (condition2 ? '둘 다 참' : 'condition1만 참') 
: 'condition1이 거짓';

 

또는 들여쓰기로 구분해도 된다.

 

let value = condition1
  ? condition2
    ? '둘 다 참'
    : 'condition1만 참'
  : 'condition1이 거짓';

 

첫 번째 조건(condition1)이 참인 경우에 중첩된 조건부 연산에 들어갔지만,

거짓인 경우에 들어갈 수도 있다.

 

> let condition1 = false;
  let condition2 = true;
  let value = condition1 ? 'condition1이 참' : condition2 ? 'condition2가 참' : '둘 다 거짓';
  console.log(value);

  condition2가 참

 

 

중첩된 조건부 연산 순서

 

역시나 가독성을 위해 소괄호 연산자로 묶는 게 좋다.

 

let value = condition1 ? 'condition1이 참' : (condition2 ? 'condition2가 참' : '둘 다 거짓');

 

 

<퀴즈>

 

다음 if 문을 switch 문과 조건부 연산자로 바꿔 보세요.

 

let cond = true
let value = '';
if (cond) {
  value = '참';
} else {
  value = '거짓';
}

 

정답은 다음과 같다.

 

// switch 문
let cond = true;
let value = '';
switch (cond) {
	case true :
		value = '참';
		break;
	case false :
		value = '거짓';
		break;
}

// 조건부 연산자
let value = cond ? '참' : '거짓';

 

조금만 생각해보면 바로 해결할 수 있는 쉬운 퀴즈 !

switch 문은 조금 헷갈리긴 하지만 조건부 연산자보다는 쉬운 것 같다.

switch 문에서 마지막에 break를 생략해도 되지만 혹시 모를 대비를 위해 break를 꼭 작성

하는 것을 습관들이자 !

 

 

---

 

 

<while 문으로 Hello, while! 100번 출력하기>

 

 

: 간단한 반복문으로 while 문이 있다.

while 문은 if 문과 아주 유사하다.

 

while (조건식)
  실행문;

 

while 문은 조건식이 참인 동안 반복해서 실행문을 실행한다.

실행문이 여러 개라면 중괄호로 묶어도 됩니다. if 문과 같은 이유로 실행문이 하나이더라도

중괄호로 묶는 것을 권장한다.

 

while (조건식) {
  실행문1;
  실행문2;
  실행문3;
}

 

다음을 실행하면 어떻게 될까?

 

> while (true) {
    console.log('Hello, while!');
  }

 

0

우와아아아 무한 반복 되는 것을 볼 수 있다.

 

 

조건식이 참이므로 console.log가 무한히 실행된다.

즉, 웹 브라우저 콘솔에 무한히 숫자가 찍힌다. 실제로 실행하면 어느 순간 웹 브라우저가 멈춰

버린다. 무한 반복을 처리하느라 웹 브라우저가 다른 일을 할 수가 없기 때문이다.

이때는 웹 브라우저를 강제 종료해야 한다. 이 같은 문제가 발생할 수 있어서 프로그래밍할 때는

무한 반복되는 상황을 방지해야 힌다.

 

 

반복문을 멈추려면 어떻게 해야 할까?

Hello, world!를 100번만 출력하고 싶다. 앞에서도 말했듯이 조건식을 false로 만들어 주면 된다.

그렇다고 조건식에 false를 넣으면 아예 실행문이 실행되지 않는다.

 

 

> let i = 1;
  while (i <= 100) {
    console.log('Hello, while!');
    i++;
  }
  (100) Hello, while!
< 100

 

 

눈 깜짝할 사이 Hello, while!가 100번 출력된다.

크롬 브라우저는 콘솔에 연이어 같은 값을 출력할 때 일일이 출력하지 않고 왼쪽에 숫자로 몇 번

출력됐는지를 표시한다. 결과로 반환되는 값 100은 i의 값이다.

 

변수 i를 선언하고 조건식을 i <= 100으로 준다.

사람이 숫자를 세듯이 console.log 할 때마다 i를 1씩 올린다. i = i + 1을 해도 되지만, 간단하게 

i += 1이나 i++로 표현할 수 있다. i가 101이 되면 조건식이 false가 되어 반복문이 멈춘다. 

예를 들어 연산자 우선순위에 의해 i가 1일 때 우항인 i + 1을 먼저 실행하고 좌항 i에 1을 넣는다.

그러면 2가 된다.

 

while, if, switch 문 같은 경우는 반환하는 값이 없는데, 조건부 연산자는 반환하는 값이 있어서

let이나 while에 i ++ 이런 조건을 넣을 수가 있다.

 

 

 

 

실제로 프로그래밍할 때는 변수에 첫 번째 값으로 1보다는 0을 많이 넣는다.

프로그래밍에서는 숫자를 0부터 세기 때문이다. 0부터 시작할 때는 조건식을 i <= 99 또는

 i < 100으로 바꿔야 한다.

 

> let i = 0;
  while (i < 100) {
    console.log('Hello, while!');
    i++;
  }

  (100) Hello, while!
< 99