1014 TIL

wecode 강의를 보면서 정리하기!

조건문

자바스크립트 조건문을 들어가기전 우리는 Boolean 타입에 대해서 알아볼 필요가 있습니다. true 와 false를 어떻게 사용하는지 좀 더 자세히 알아보겠습니다.

console.log(true)
console.log(false)

console.log('true')
console.log('false')

true
false
"true"
"false"

boolean 타입과 string 타입 true/false 의 결과가 다른 것을 볼 수 있습니다. 콘솔로그에 true / false를 언제 활용하는지 알아보겠습니다.

console.log(1 + 1 === 2)
true

console.log(1 + 1 === 3)
false

위에 두 코드를 보면 이 코드가 참이다, 거짓이다를 나누게 되는겁니다.

console.log('Code Kim' === 'CODE KIM')
false

자바스크립트는 문자의 대소문자를 구별할 수 있는 언어기 때문에 소문자가 섞인 문자와 대문자로만 이루어져있는 문자를 다르다고 판단한 것 입니다.

boolean 타입과 조건문이 어떤 관계가 있는지, 조건문을 만들기 위해 사용해야하는 비교연산자는 뭐가 있는지 알아보도록 하겠습니다.

조건문의 시작
만약 (조건이) 참이라면 ~
만약 (조건이) 거짓이라면 ~

특정한 조건이 참이라면 A코드 실행, 혹은 거짓이라면 B코드 실행 이런식으로 진행이 됩니다.

조건문과 true / false가 늘 같이 있는 이유는 참이냐 거짓이냐에 따라서 실행되는 코드가 달라지기 때문입니다.

비교를 통해서 참 거짓을 판별한 다음에 어떠한 다른 코드를 실행하는 것 비교연산자라는 것을 공부해야합니다.

1 + 1 === 2 -> true
1 + 1 === 3 -> false
1 + 1 !== 3 -> true
1 + 1 !== 2 -> false

if문을 한 번 만들어 보겠습니다.

if (1+1 === 2) {
  console.log('1더하기 1은 2입니다.')
}
1더하기 1은 2입니다. // 결과

if 옆에 조건문이 true이기 때문에 결과가 도출됩니다.

let name = 'wecode Lee'

if (name === 'wecode Lee') {
  console.log('Hi, my friend!')
}
Hi, my friend!

조건을 충족할때만 코드가 실행됩니다. name 이 다르면 false 가 나옵니다. 그러면 false일 때 다른 코드가 실행되는걸 원하면은 이럴때 if 와 else를 사용합니다.
if와 else를 사용하면 두 가지 상황에서 서로 다른 코드를 실행해줄 수 있습니다.

let name = 'kimel'

if (name === 'Code Kim') {
  console.log('저는 김코드입니다.')
} else {
  console.log('저는 김코드가 아닙니다.')
}
저는 김코드가 아닙니다.

이렇게 false라면 else문이 실행이 됩니다. 그래서 '저는 김코드가 아닙니다.' 라는 문장이 출력되는 것입니다.

그렇다면 다른 예시를 들어보겠습니다.
else if 의 관해서 공부해보도록 하겠습니다.
if도 아니고 else if도 아니면 else가 실행되게 할 때 쓸 수 있습니다.

let name = 'Hello Lee'

if (name === 'Code Kim') {
  console.log('저는 김코드입니다.')
} else if (name === 'Hello Lee') {
  console.log('저는 김코드가 아닙니다. 저는 이헬로입니다.')
} else {
  console.log('저는 김코드도 아니고, 이헬로도 아닙니다.')
}

저는 김코드가 아닙니다. 저는 이헬로입니다. // 결과

이런식으로 먼저 맨 위에 if 를 비교해서 true가 아니라면 else if 로 넘어가고 이것마저 아니라면 else로 최종적으로 넘어가는 것입니다. else if 는 무한히 많이 쓸 수 있습니다.

예제문제

function isOkayToDrive(who) {
  if (who === 'son') {
    return "Nope!"
  } else if (who === "dad") {
    return "Good!"
  } else if (who === "grand father") {
    return "Be carefull"
  } else {
    return "who are you?"
  }
}

console.log(isOkayToDrive("dad"))

"Good!" // 결과

순서대로 걸러보면서 결과를 반환합니다. 이때 isOkayToDrive(who) 와 (isOkayToDrive("dad") 에 괄호 안에 있는 것은 파라미터와 인자라고 표현하는데 둘은 변수같은 존재입니다. 그래서 who = dad 라고 생각하면 됩니다.

논리 연산자는 알기때문에 딱히 자세히 적지는 않겠습니다.
&& 와 || 그리고 !

Truthy 와 Falsy 에 대해 알아보겠습니다.
Truthy - 참은 아니지만 참 같은 값
불리언을 기대하는 문맥에서 true로 평가되는 것. 진짜 true는 아니지만 true처럼 관리되는 값
Falsy - 거짓은 아니지만 거짓 같은 값
false, 0, -0, 0n, "", null, undefined, NaN
모두다 Falsy고 나머지는 Truthy

let a = 0 // falsy
let b = 100 // truthy

if (a) {
  console.log('i am falsy')
} else if (b) {
  console.log('i am truthy')
}

원래는 if 문 옆에 true 인지 false인지 구별하는 코드가 들어가야하는데 0 은 Falsy한 값이기때문에 false 가 되는 것이여서 실행이 안되고 100은 Truthy한 값이기때문에 true 처럼 행동하게 되어서 실행이 i am truthy 가 콘솔에 출력되는 것을 볼 수 있습니다.

공부를 많이 해야한다. 화이팅!!!