[프론트앤드 공부기록] Javascript 기초 2

---

6. 비교연산자, 조건문

비교연산자가 쓰였을 때 반환되는 값은 오로지 불린값

※ == 가 동등연산자라고 하는데 이상하게 동작할 때가 있다.

1 == "1" // true

숫자형 1과 문자형 1을 비교했을 때 true가 나옴

1 === "1" //false

그런데 === 이렇게 3개를 쓰먄 타입까지 비교하는 동등연산자가 된다 -> 일치연산자

가급적이면 동등 연산자보다는 일치 연산자를 쓰는게 좋다

 

---

7. 조건문

if

if(age>19){
console.log('환영합니다.')';
}

코드가 한 줄 뿐이라면 중괄호{}를 생략해도 좋지만 가독성을 위해서는 있는게 좋다.

 

** if뒤 () 괄호 안의 값은 항상 불린으로 변환된 다음에 판단된다 true/false

 

else

if문의 조건이 false일 때 실행된다

else if(else 위에서 사용)

 

그러니까

if(){
} else if{
} else{
}

이렇게

 

 

---

8. 논리 연산자

• || : or (a||b // a나 b중 하나라도 true가 있으면 true)
• && : and (a&&b // a와 b 둘 다 true여야 true)
• ! : not (!a // a가 false이면 true)
• or : 하나라도 true면 true. 모든값이 false일때만 false
• and : 모든 값이 true면 true. 하나라도 false이면 false
• not : true면 false. false면 true

 

**

or은 첫 번째 true를 발견하는 즉시 평가를 멈춤 (true가 하나 있기만 하면 true니까)

and는 첫 번째 false를 발견하는 즉시 평가를 멈춤 (false가 하나라도 있으면 false니까)

 

※ tip

운전면허가 있고 시력이 좋은 여자 군인

운전면허 = 전체 군인 중 80%

시력이 좋은 = 전체 군인 중 60%

여자 군인 = 전체 군인 중 7%

라면

여자 군인인데 시력이 좋고 운전면허가 있는 사람

으로 코딩하는게 더 좋다 (로드시간을 단축시킬 수 있음)

=> 최적화에 도움이 된다

 

우선순위

&& > ||

 

 

 

9. 반복문 loop

 

반복문은 코드를 줄이는 좋은 방법 중 하나

 

for

for(let i=0; i<10; i++){
//반복할 코드
}

let i =0 부분 -> 초기값

반복문에 진입할 때 첫 한번만 실행됨.

 

I<10부분 -> 조건

false가 되면 멈춤

 

i++부분 -> 코드 실행 후 작업

=> i값이 10이 되면 작업을 멈춤

 

초기값을 지정하고 조건이 true이면 코드를 실행하고(반복할 코드) i++부분의 작업을 진행.

또 조건을 확인하고 코드를 실행하고 다시 i++

조건을 확인해서 false이면 반복문을 빠져나옴

 

 

while

let i = 0;
while(i<10){
//반복할 코드 -->여기에 i의 변화를 넣어야 함 ex ) i++
}

i를 0부터 시작해서

i가 10 미만이 될 때까지

//반복할 코드를 실행해라

 

 

do...while

while과 비슷한데 조건문을 아래로 옮길 수 있다

let i = 0;
do{
//반복할 코드
i++
} while(i<10)

do...while의 순서

일단 코드를 실행하고 조건을 체크. 일단 한 번을 실행한다는게 while과 큰 차이

i를 0부터 시작해서

//반복할 코드를 실행하고

i를 하나씩 키워라

i가 10 미만이 될 때까지

 

※i는 변수이름. 꼭 i가 아니어도 된다

 

 

반복문을 빠져나오는 방법

• break : 만나는 즉시 반복문을 멈추고 해당 반복문을 빠져나옴
• continue : 멈추는 것 까지는 동일하지만 반복문을 빠져나오지는 않고 다음 반복으로 점프

 

** while(true)는 무한반복임. break를 만날 때까지

while(true){
let answer = confirm('계속 할까요?');
if(!answer){
break;
}
}

계속한다

'계속 할까요?'라는 확정창을 띄운다

답이 '예(true)' 라면 다시 계속한다

만약=(if) 답이 '아니오(false)'라면=(!answer)

반복문을 빠져나온다

 

for(let i =0; i < 10; i++){
if(i%2){
continue;
}
console.log(i)
}

1. 0을 2로 나누면 나머지가 0이기 대문에 console.log를 찍는다

2. 1을 2로 나누면 나머지가 1이기 때문에 continue를 만나게 된다. 그래서 log를 만나지 않고 바로 다음으로 진행

i가 0일 때를 기본값으로 하고 i가 10이 될 때까지 i를 1씩 키워가면서 진행하는데

만약=(if) i값을 2로 나누었을 때의 나머지가 0이면 false라는 값이 도출되게 된다. (값이 나오면 true)

따라서 나머지가 0인 값은 if문을 타지 못하고 console.log(i)문을 타게 된다.

그 결과 console.log(i)로 뜬 값은

//0,2,4...의 짝수 값일 것이다.

 

** 명확한 횟수가 정해져 있으면 for, 그게 아니면 while을 사용한다고 하심

 

 

---

10. 스위치(switch)

모든 switch문은 if else로도 작성할 수 있다.

그러나 switch를 쓰는 이유 = 케이스가 다양할 경우 보다 간결하게 작성이 가능하기 때문

switch(평가){
case A :
//A일 때 코드(실행할 명령)
default;
case B :
//B일 때 코드(실행할 명령)
default;
...
}

if(평가===A){
//A일 때 코드(실행할 명령)
} else if(평가===B){
//B일 때 코드(실행할 명령)
}

 

※ case는 아래에 있는 내용을 다 실행한다

ex)

let cats = prompt('고양이가 몇 마리인가요?');
switch(cats){
  case "1":
    console.log('고양이 한마리');
  case "2":
    console.log('고양이 두마리');
  case "3":
    console.log('고양이 세마리');
  case "4":
    console.log('고양이 네마리');
}

// propmt 질문 '고양이가 몇 마리인가요' 물음에 2 값을 입력했을 때

원하던 '고양이 두마리' 가 아닌

"고양이 두마리"

"고양이 세마리"

"고양이 네마리"

라는 값이 도출된다

 

따라서

switch의 각 case마다 break를 실행시켜줘야 한다

 

let cats = prompt('고양이가 몇 마리인가요?');
switch(cats){
  case "1":
    console.log('고양이 한마리');
    break;
  case "2":
    console.log('고양이 두마리');
    break;
  case "3":
    console.log('고양이 세마리');
    break;
  case "4":
    console.log('고양이 네마리');
    break;
}

// 2 값을 입력했을 때

"고양이 두마리"

만 나오는 것을 확인할 수 있다.

 

그러나 prompt질문에 2394729같은 대답을 하게되면

값은 도출되지 않는다 =(case에 속하지 않는 값은 도출되지 않는다)

case에 없는 값을 만들어줘야 한다.

default를 이용하자

let cats = prompt('고양이가 몇 마리인가?');
switch(cats){
  case "1":
    console.log('고양이 한마리');
    break;
  case "2":
    console.log('고양이 두마리');
    break;
  case "3":
    console.log('고양이 세마리');
    break;
  case "4":
    console.log('고양이 네마리');
    break;
  default:
    console.log('제대로 세어봐');
}

// 이제 23479같은 값을 입력했을 때 '제대로 세어봐'가 도출된다

 

+

case "1" 처럼 문자로 묶은 이유

= prompt는 모든 내용을 문자로 인식하기 때문.

case "노트북"

case "컴퓨터" 등도 가능하다

 

++

만약 case "노트북"과 case"컴퓨터" 의 도출값이 같아야 한다면 따로 두 개를 만들 필요 없이 

switch(price){
case "노트북","컴퓨터":
console.log('200만원');
break;
}

처럼 만들어도 된다