JS #4-자바스크립트 기초 개념4-논리연산자, 조건문 switch, 반복문 while

논리연산자

OR ||
피연산자가 모두 false인 경우를 제외하고는 모두 true
첫 번째 Truthy를 찾는 것

hour가 10보다 작거나 18보다 큰 것에 해당한다면 블록 안의 조건을 수행한다. 

 

 

OR 연산자가 여러개인 경우

• 가장 왼쪽 피연산자부터 시작하여 오른쪽으로 나아가며 피연산자를 평가한다. 
• 각 연산자를 불린형으로 변환한다. 변환 후 그 값이 true 이면 연산을 멈추고 해당 피연산자의 변환 전 원래 값을 반환한다. 
• 피연산자 모두를 평가한 경우(모든 피연산자가 false로 평가되는 경우) 엔 마지막 피연산자를 반환합니다. 

 

AND &&
두 피연산자가 모두 참(true)일 때 값을 반환하며, 그 외엔 false를 반환한다. 
첫 번째 Falsy를 찾는 것

• 첫 번째 False를 만나면 반환한다. 
• 두 피연산자가 모두 True이면 마지막 값을 반환한다. 

 

AND 를 이용해 조건식 작성 (비 권장)

AND를 이용해서 조건식을 작성하면, 

(x>0)가 참이어야 다음 연산자인 alert가 실행되므로 if와 동일하게 동작한다. 

다만, 비권장됨

 

 

NOT !
!! = Boolean형으로의 암시적 형변형

 

 

피연산자로 함수가 온다면? 
함수의 반환값을 특정 하지 않는 경우 'undefined'라는 것을 알아야 한다. 

 

첫 번째 피연산자인 alert(1)이 실행되면 콘솔에 1이 찍히고 함수의 반환값인 undefined가 반환된다. 

때문에 1번은 False가 된다. 

두 번째 피연산자인 2가 True가 되어 전체를 감싸는 alert가 실행되며 2가 출력되고 끝난다. 

 

 

OR AND가 함께 들어간 조건식 : AND가 항상 먼저 실행된다. 

 

 

논리합 할당연산자 

 

 

 

Optional Chaining ?.

toLowerCase()

let userName = prompt('아이디를 입력해 주세요');

console.log(userName);

let password;

//상황

//1. 사용자가 취소를 누른 경우 => null

//2. 사용자가 esc를 누른 경우 => null

//3. 아무것도 입력하지 않았을 경우 => ''

//4. 띄어쓰기를 입력한 경우 => ' '

if (userName?.toLowerCase() == 'Admin') {

  console.log('아이디 맞음');

  password = prompt('비밀번호를 입력해 주세요.');

  if (password?.toLowerCase() == 'themaster') {

    alert('환영합니다!');

  } else if (password === null || password === ' ') {

    alert('취소하였습니다.');

  } else {

    alert('인증에 실패하였습니다.');

  }

} else if (userName == null || userName == ' ') {

  console.log('취소했습니다.');

  alert('취소했습니다.');

} else {

  console.log('올바른 사용자가 아닙니다!');

  alert('올바른 사용자가 아닙니다!');

}

물음표 앞이 null이나 undefined가 뜨면 뒤를 실행하지 않는다. 

따라서, nulldlsk undefined가 userName이나 password에 저장되면 뒤에 문법이 실행되지 않는다! 

 

 

includes 메서드

배열에 해당 값이 포함되는지 확인할 때 사용한다. 

arr.includes('2') -> 배열에 문자열 2가 포함되었는지 확인

---

 

switch ... case 문

if문과 switch문의 차이

if문 -> 맞는 조건에 도달할때까지 계속해서 조회를 함

switch문 -> 해당하는 조건에만 들어가서 조회를 함

 

조건문이 많을 때는 switch문이 효율적일 수 있다. 

 

 

switch case문은 '일치비교'가 일어난다.

값의 형식까지 동일한 일치비교 '===' 가 실행된다. 

 

 

 

switch 날짜 출력하기

const num = +prompt('0~6 사이의 숫자를 입력해주세요.');

// const num = 2;

switch(num) {

    case 0: console.log('일'); break;

    case 1: console.log('월'); break;

    case 2: console.log('화'); break;

    case 3: console.log('수'); break;

    case 4: console.log('목'); break;

    case 5: console.log('금'); break;

    case 6: console.log('토'); break;

}

** 입력 받은 숫자를 반드시 + 연산을 통해 숫자로 변경해주자! -> prompt는 문자열로 받아지니까!

 

 

난수 생성 : Math.random()

Math.random() 을 하게 되면 랜덤으로 난수를 생성한다. 이 때 

범위는 0~ 0.999999999999이렇게 나온다.

 

Math.random() * 6 을 하게 되면 0~ 5.xxxxxxxxx까지 나오게 될 것이다. 따라서 뒷부분을 floor로 절삭을하면 0~5까지의 랜덤한 수를 구할 수 있다. 

 

const num = Math.floor(Math.random() * 7);

console.log(num);

switch(num) {

    case 0: console.log('일'); break;

    case 1: console.log('월'); break;

    case 2: console.log('화'); break;

    case 3: console.log('수'); break;

    case 4: console.log('목'); break;

    case 5: console.log('금'); break;

    case 6: console.log('토'); break;

}

ㄴ 랜덤으로 요일 구하기

 

 

위의 예제를 함수를 이용해 관리해보면 ~?? 

function getRandom() {

    return Math.floor(Math.random() * 7);

}

function randomGetDay(num) {

    console.log(num);

   

    switch(num) {

        case 0: console.log('일'); break;

        case 1: console.log('월'); break;

        case 2: console.log('화'); break;

        case 3: console.log('수'); break;

        case 4: console.log('목'); break;

        case 5: console.log('금'); break;

        case 6: console.log('토'); break;

    }

}

randomGetDay(getRandom());

 

*함수를 만들 땐 재사용성을 고려하여 (!!관심사의 분리) separation of concern

ㄴ 각자의 기능만 수행할 수 있도록 분리하여 만들어주자

ㄴ 결과값은 그를 모두 취합하여 수행하도록

 

 

Nullish 연산자 ?? 
정.의.된 값을 찾는다!! (null과 undefined가 아닌)

||s는 첫 번쨰 trutthy를 반환하고

??는 첫 번째 정의된 값을 반환한다. 

 

??는 의도적으로 정의된 값에 대해서는 밖에 내내 된다. 

 

 

 

Nullish 연산자를 이용하여 조건문 작성하기~ 

let emailAddress = 'chaeyoungg77@gmail.com';

let receivedEmailAddress;

if (emailAddress === undefined || emailAddress === null) {

  receivedEmailAddress = 'user@company.io';

} else {

  receivedEmailAddress = emailAddress;

}

 

// 3항 연산자 (ternary) 를 사용한 식으로 변경합니다.

receivedEmailAddress = (emailAddress===undefined || emailAddress===null) ?  emailAddress :'user@company.io';

// 위 조건 처리문을 nullish 병합 연산자를 사용한 식으로 변경합니다.

receivedEmailAddress = emailAddress ?? 'user@company.io';

emailAddress가 undefined이거나 null이면 뒤에 문자가 실행된다. 

 

 

 

---

 

반복문

반복 '문'  = 값을 반환하지 않는다! 

 

 

while

iteration 의 약자 i! 

i가 3보다 작을 때 까지 while문이 돈다. 

 

  // while 문 (순환 : 순방향)

  let num = 7;

  let i = 0;

/*   while(i < num){

    const result = frontEndDev[i]

    // console.log(result);

    i++;

  } */

  // while 문 (역순환 : 역방향)

  let j = frontEndDev.length - 1;

  while(j >= 0) {

    const result = frontEndDev[j];

    console.log(result);

    j--;

}