일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- K-Digital Credit
- 최원영 저자
- 알고리즘
- 엘리스코딩
- 노마드코더
- 공부를 가장한 일기일지도
- Do it! 시리즈
- IT 지식
- 개발자북클럽
- 톺아보기
- javascript
- 비전공자를 위한
- 구름edu
- boj
- SQLD
- CodeStates
- SQL 개발자
- 제로베이스
- nomadcoders
- 프로그래머스
- 모던 자바스크립트 deep dive
- 자바스크립트
- 오블완
- 노마드 코더
- 백준
- 자격증
- 이해할 수 있는
- js
- 노개북
- 티스토리챌린지
- Today
- Total
개발자를 희망하는 초보의 자기개발 이야기
JavaScript 조건문(Condition) 본문
JavaScript 조건문(condition)
: 조건문은 특정한 조건 아래서만 코드가 실행되게 하는 구문. 즉, 표현식의 결과값에 따라 별도의 명령을 수행하도록 하는 실행문입니다. 조건문에는 반드시 비교 연산자가 필요합니다. 비교의 결과는 Boolean형태, 즉 true 또는 false입니다.
3 > 5; // false
9 < 10; // true
: 1은 숫자고 '1'은 문자열로 자료형이 다릅니다. 연산자에서 기술했듯이 자료형까지 정확히 비교하기 위해서는 ===(일치연산자) 또는 !==(불일치연산자)를 사용해야 합니다.
1 == '1' // ture
1 === '1' // false
: 조건문 중 if문에 대해 공부합니다. if로 시작하고 괄호 안에 조건이 오는데 값이 true라면 중괄호 {} 안의 구문이 실행됩니다. true나 false 자체를 넣어도 반응하지만 비교가 아니라 값을 바로 대입해버리는 것이기 때문에 실질적으로는 그렇게 쓰지 않습니다.
if (조건1) {
// 조건1 true면 실행
} else if (조건2) {
// 조건1이 true가 아닐 때
// 조건2 true면 실행
} else {
// 모든 조건이 true가 아니면 실행
}
// 조건에는 boolean으로 결과가 나오는 비교구문이 들어갑니다.
: 1부터 5까지 출력되는 조건문을 아래와 같이 만들면 괄호 안이 true이기 때문에 1~5까지가 출력됩니다.
if (true) {
console.log(1) // 1
console.log(2) // 2
console.log(3) // 3
console.log(4) // 4
} // 조건1 true면 실행
console.log(5) // 5
: 괄호 안이 false가 되면 5만 출력됩니다. 중괄호 안의 내용은 모두 실행되지 않고 조건문 밖의 내용만 실행되기 때문입니다.
if (false) {
console.log(1)
console.log(2)
console.log(3)
console.log(4)
} // 조건1 false면 미실행
console.log(5) // 5
: else의 경우 if가 true일 경우는 실행되지 않고 false로 거짓값이면 넘어와서 실행됩니다.
if (true) {
console.log(1) // 1
console.log(2) // 2
} else {
console.log(3)
console.log(4)
} // 조건1 true로 else부분 미실행
if (false) {
console.log(1)
console.log(2)
} else {
console.log(3) // 3
console.log(4) // 4
} // 조건1 false로 else부분 실행
: else if의 경우 여러 조건을 가질 때 사용합니다. if는 처음에만, else는 마지막에만(생략 가능) 사용할 수 있지만 else if는 중첩사용이 가능합니다. 모든 조건에 해당하지 않는 부분을 else로 남겨둡니다.
if(false) {
console.log(1)
} else if(false){
console.log(2) // 조건1,2 둘 다 false로 미실행
} else if(true){
console.log(3) // 조건3 true로 실행.
} else{
console.log(4) // 4
} // 조건3 실행되어 else 부분 미실행
: 간단한 if else문은 ?기호를 이용해서 삼항연산자로 바꿀 수 있습니다. 다만 가독성을 위해 남발하지 않는 것이 좋습니다.
let i = 10, j;
if (i > 10) {
j = 15;
} else {
j = 5;
} // j = 15;
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ
let i = 10, j;
let j = i > 10 ? 15 : 5;
표현식 ? 반환값1(true일 때) : 반환값2(false일 때)
// j = 15;
: 조건문은 중첩해서 사용할 수 있습니다. 이때 논리연산자를 사용합니다.
let i = 10, j = 5, k;
if (i > 9 && j > 4) { // (i > 9)는 true이고 (j > 4)도 true이기 때문에 k = 15 로 할당된다.
k = 15;
}
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ
let i = 10, j = 5, k;
if (i > 10 && j > 4) { // (i > 10)는 false이고 (j > 4)도 true이기 때문에 할당 안됨. undefined
k = 15;
}
: 항상 false로 판별하는 falsy값이 있습니다. 아래의 조건들은 if문에서 false로 변환되므로 if구문이 실행되지 않습니다.
if (false)
if (null)
if (undefined)
if (0)
if (NaN)
if ('')
정리
- 결과값에 따라 명령을 실행
- 비교연산자 // 결과는 true 또는 false
- ===와 !== // 자료형까지 비교
- if와 else는 각각 1쌍
- else if는 그 사이 조건을 중첩할 때 사용
- ?기호를 이용해 삼항연산자로 표현 가능
- falsy값 6가지
참고
'프론트엔드(Front-end) > JavaScript' 카테고리의 다른 글
JavaScript 반복문(Loop) (0) | 2020.12.26 |
---|---|
JavaScript 문자열(String) (0) | 2020.12.20 |
JavaScript 연산자(operator) (0) | 2020.12.20 |
JavaScript 함수(Function) (0) | 2020.12.14 |
JavaScript 자료형(Data Type) (0) | 2020.12.13 |