Js 조건문

Hanachoi 2022. 5. 20. 22:32

---문은 statement.
조건문은 조건에따라 코드를 실행하거나 아니거나
가장 흔한 조건문은 로그인 : 로그인 했으면 했을 때 페이지 보여주고 아니면 로그인페이지 보여주기
if(조건식)에서 조건식의 값이 true면 안에 실행문이 동작하게 되어있음.
if문에서 if 는 필수지만 밑에 else 부분은 선택적

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

조건문에서는 어떤 값이 true/false 인지 알아두는게 좋음.
false, 0, ''(빈문자열), NaN, null, undefined만 거짓인 값. 나머지는 true니까 얘네만 외워두자
if문 끝 {} 뒤에는 보통 세미콜론을 안붙임
띄어쓰기를 잘하면 {}를 안붙여도 실행은되지만 오류의 위험을 줄이기 위해 그냥 사용하도록 하자.
true라는 값을 직접 넣어줄 필요없이 true로 변환되는 값이나 그것을 담고있는 변수를 넣어도 된다.

> let value = '사과';
  let condition = true;
  if (condition) {
    value = ‘바나나’;
  }
  console.log(value);

 // 바나나 출력

#else 를 사용해 두방향으로 분기하기

if(조건식){ // 조건식이 참인 값일때 실행
	실행문;
}else{ //조건식이 거짓인 값일때 실행 
	실행문;
}

if (조건식) {
  실행문;
} else if (조건식) {
  실행문;
} else if (조건식) {
  실행문;
}else {

}

마지막에 else로 끝나면 거기에는 조건식을 붙여주지말자! unexpected token error가 뜨길래 계속 찾아봤는데 답은 안나왔다 ㅠㅠ 근데 계속 보니 else 뒤에는 조건식이 안붙는거 같아서 지워보니까 코드가 제대로 작동함.

const score = 75;
if(score >=90){
	console.log('A+')
}else if(score <90 && score >= 80){
	consol.log('A')
}else if(score < 80 && score >= 70){
	console.log('B+')
}else{
	console.log('C')
}

if의 조건식에서는 조건식을 합칠 수가 없음. 90 > score > 80 이런식으로의 작성이 안되서 꼭 저렇게 따로 만들어줘야함.
사실 위의 코드에서 각각의 조건식에 붙어있는 미만의 조건(ex . score < 90)들은 때버려도 된다 .어차피 처음에 score >=90 에서 false라서 밑으로 내려온 경우이기 때문.
조건문 특성상 비교는 항상 위에서부터 내려온다.
console 창에서는 새로고침하면 선언했던 변수들다 날아간다.

#중첩 if 문

if 문안엔 또다른 if-else문을 넣어서 if statement를 만들어 낼 수 있다. 하지만 이렇게 안하는게 좋음. if 문 안에 코드를 작성할 때 우리는 기본적으로 들여쓰기를 하는데 이런식으로 if문안에 또 if 문을 넣으면 계속 들여쓰기가 되면서 코드가 지저분해지는 경우가 많다.
들여쓰기가 최대한 안생기도록 코드르 짜도록 하자

let first = true;
let second = false;
if(first){
    console.log('첫번째 조건 충족')
    if(second){
        console.log('두번째도 충족')
    }else{
        console.log('두번째는 불충족')
    }
}else{
        console.log('첫번째 조거 부')
    }

이렇게 되면 가독성이 떨어지기때문에 if-else if-else이런 식으로 변환해서 가독성을 높이는 편이 좋다.

if(first && second){
    console.log('첫번쨰 충족')
    console.log('두번쨰 충족')
}else if(first){
    console.log('첫번째만 충족')
    console.log('두번째 안충족')
}else{
    console.log('첫번째 안충족')
}

#switch 문으로 분기

switch(조건식){
	case 비교조건식
    	동작문;
}

switch(조건식)안에 조건식이 case의 비교조건식과 같으면 동작문이 실행되는 형식.
비교조건식이 여러가지로 들어갈 수 있는데, switch문의 특징은, 조건식과 비교조건식이 같아지면 그 아래로 동작문이 모두 실행되게 된다.

let value = 'B'
switch(value){
    case 'A' : 
        console.log('A')
    case 'B' : 
        console.log('B')
    case 'C' : 
        console.log('C')
} 

// B, C 모두 출력됨

만약에 조건이 주르륵 실행되지 않고 딱 해당되는 부분만 실행되게 하고 싶으면 break;를 써주면 됨
만약에 어떤 조건도 해당되지 않을 때의 케이스르 만들려면? case 대신 default를 써주면 됨.
switch문에서는 default가 가장 위에 나와도 문제없이 작동한다.

let value = 'B'
switch(value){
    case 'A' : 
        console.log('A')
        break;
    case 'B' : 
        console.log('B')
        break;
    case 'C' : 
        console.log('C')
        break;
}

#조건부 연산자(삼항연산자)

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

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

[ 기본적으로 조건식 , 참일 때 실행, 거짓일 때 실행 ] 이렇게 세 부분으로 나뉘어져 있음
결국 switch랑 조건부 연산자도 모두 if 문으로 바꿀 수가 있다.
if문으로 여러 줄 될 것을 이건 한 줄로 만들 수 있기 때문에 좋기 하지만, 코드가 짧아지면 가독성이 떨어지는 경향이 있음.
하지만 개발자마다 선호도가 다르고 다른 문법을 사용할 수 있기 때문에 결국 모든 문법을 다 알아둬야 된다.

let conditional1 = true;
let conditional2 = false;
let value = conditional1 ? conditional2 ? '둘다 참 ' : 'conditional1만 참' : 'conditional 1이 거짓' ;
console.log(value);

//conditional1만 참

조건부 연산자도 계속 중첩될 수 있는데 중첩되다보면 헷갈리게 된다. 그럼 안쪽의 조건식이 뭔지부터 찾아보고 ()로 묶어주자.
conditonal 1이 참일때, conditional2에 대한 조건식이 한 번 더 실행되게 되는 것.

let conditional1 = true;
let conditional2 = false;
let value = conditional1 ?(conditional2 ? '둘다 참 ' : 'conditional1만 참' ): 'conditional 1이 거짓' ;
console.log(value);

//conditional1만 참