0810 TIL

시맨틱 태그

<button>태그는 특정한 액션을 위해서
예) 로그인/가입/퀴즈풀기 등등...
<a>태그는 어디론가 이동할 때 (링크)

<table>보다 CSS Flex, Grid를 이용하여 스타일링을 해주는 것이 좋다.

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

조건부 연산자의 기본 형식

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

< 코드 >

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

switch문을 if문으로 바꿀 수 있는 것처럼 조건부 연산도 if문으로 변경할 수 있습니다.

< 코드 > 조건부 연산자

let condition = true;
let value = condition ? '참' : '거짓';
console.log(value)

< 코드 > 조건부 연산자를 if문으로 바꾼 것

let condition = true;
if(condition) {
	value = '참';
}else {
	value = '거짓';
}
console.log(value);

< 코드 > 조건부 연산자 중첩

let condition1 = true;
let condition2 = false;
let value = condition1 ? (condition2 ? '둘 다 참' : 'condition1만 참') : 'condition1이 거짓';
console.log(value);
결과 = condition1만 참

중첩될 때는 ()로 묶어주는 게 좋음

• 연산 순서
  

설명: 안에 있는 식인 condition2 ? '둘 다 참' : 'condition1만 참'에서 condition2는 false이기 때문에 false 자리에 있는 'condition1만 참'이 선택된다. 그 다음 밖에 있는 true인 condition1 ? 이 실행되면서 true자리에 생긴 'condition1만 참' 과 false 자리에 'condition1이 거짓' 과 비교하게되면서 true자리에 있는
'condition1만 참'이 결괏값으로 나올 수 있는 것이다.

< 코드 > if문을 switch문, 조건부 연산자로 바꾸기
if문

let cond = true;
let value = '';
if (cond) {
    value = '참';
}else {
    value = '거짓';
}

switch문

let cond = true
let value = '';
switch (cond) {
    case true:
        value = '참';
        break;
    case false:
        value = '거짓';
        break;
}

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

let value = cond ? '참' : '거짓';

복잡한 경우는 조건부 연산자를 쓰지 않는다. 쓰려다가 더 난리가 날 수가 있다.

while문

무한 반복문을 잘못치면 컴퓨터가 뻑이날 수도 있다.

while (true) {
    console.log('hello while!');
}

-> 예를 들어 이런 코드가 무한반복문이 걸린다. true니까 계속 실행하는 것이다. 그런데 생각을 해보자.
그렇다면 false를 넣으면 항상 실행이 안될 것이다. 그러니까 우리는 어떤 때는 됐다가 어떤 때는 안되는 코드를 만들어야한다는 것이다. 그러므로 여기서 필요한건 '변수'이다.
변수는 변하는 값이기때문에 그 변수를 true로 만들었다가 그동안 계속 반복되고 false로 바꾸면 더이상 반복이 안되게끔.

< 코드 >

let i = 1;
while(i <= 100){
    console.log('hello while!');
    i++;
}

코드 결과 : hello while! 이 100번 실행된 모습을 보인다. 그리고 100을 retrne 한다.

<팁>
i = i +1 은 i += 1 로 표현할 수 있다.
i++ 는 지금 같은 상황에서는 쓸 수 있지만 조금 다르다.