계속 느끼고있던, 기본기 부족를 이제서야 제대로 되짚어보게되었다.
아는 부분은 훑고 넘어가고, 헷갈리거나 중요한부분은 따로 정리!!
NaN
: 계산 중에 에러가 발생했다는 것을 나타내주는 값,// typeof() 연산자는 인수의 자료형을 반환해준다.
평소에 쓰던 것 말고, 생소한 연산자를 가져왔다
1. 거듭제곱 연산자 **
a ** b
는 a
를 b
번 곱한다는 뜻이다.
+
를 이용해 숫자형으로 변환let apples = "2";
let oranges = "3";
console.log(+apples + +oranges) // 5
// 덧셈 연산자가 적용되기 전에, 두 피연산자는 숫자형으로 변화한다.
let counter = 2;
counter++ // 2
++counter // 4
✏️ 전위형과 후위형
a
, b
, c
, d
?
let a = 1, b = 1;
let c = ++a; // ?
let d = b++; // ?
a = 2, b =2, c = 2, d = 1
✏️ 형 변환
"" + 1 + 0 // "10"
// `""+1` : 문자열로 변환
"" - 1 + 0 // -1
// `-`는 숫자자형만을 인수로 받는다.
true + false // 1
6 / "3" // 2
"2" * "3" // 6
4 + 5 + "px" // 9px
"$" + 4 + 5 // $45
"4" - 2 // 2
"4px" - 2 // NaN
7 / 0 // Infinity
" -9 " + 5 // -9 5
" -9 " - 5 // -14
// 뺄셈 연산자는 인수를 숫자형으로 변환
// `"-9"`는 숫자 -9로 변한다.
null + 1 // 1
undefined + 1 // NaN
// undefined는 숫자형으로 변환시 NaN가 된다.
" \t \n" - 2 // -2
// \t \n 공백을 나타내서, 그냥 공백이 된다.
💬 생각보다 형변환을 많이 놓치고 있던 거 같아서 깜짝 놀랬다.
타입스크립트를 하려면 자료형에 대해 잘 알고있어야 했는데,
다시 돌아볼 수 있는 기회가 되어서 많은 도움이 되었다.
null
과 undefined
는 동등 비교(==)시 서로 같지만 다른 값과는 같지 않습니다.null
이나 undefined
가 될 확률이 있는 변수가 > 또는 < 의 피연산자로 올 때는 주의 하자✏️ 비교
5 > 4 // true
"apple" > "pineapple" // false
// 사전순이면, p가 더 크다.
"2" > "12" // true
// 2와 1의 비교라, true
undefined == null // true
undefined === null // false
// `===`는 형도 체크!
null == "\n0\n" // false
null === +"\n0\n" // false
✔️ ===
일치 연산자는 형도 체크한다!!
💬 그냥 넘어갔던 부분을 다시 체크했다.
몰랐던 사실도 알게 되었다!
✏️ if와 문자열 0
아래 코드에서 alert은 실행될까요?
if ("0") {
alert( 'Hello' );
}
➡️ yes!
모든 문자열은 true
를 반환
✔️ &&의 우선순위가 ||보다 높습니다.
AND 연산자 &&의 우선순위는 OR 연산자 ||보다 높습니다.
따라서 a && b || c && d는 (a && b) || (c && d)
와 동일하게 동작합니다.
✏️ AND 연산의 결과는 무엇일까요?
alert( 1 && null && 2 );
// null 출력
// 첫번째 falsy가 출력된다.
alert( alert(1) && alert(2) );
// 1 출력 후 undefined 출력
➡️ alert 를 호출하면 undefined가 반환
alert는 단순히 얼럿 창에 메세지만 띄어주고, 의미 있는 값을 반환하지 않는다.
그러니까, 1을 출력하고 1을 출력 후 결과가 undefied이기 때문에 undefined를 띄우고 종료
✏️ OR AND OR 연산자
alert( null || 2 && 3 || 4 );
// 3 출력
➡️ &&연산자의 우선순위로, 2 && 3 은 3이기때문에, 3 출력 후 종료
💬 제대로 알고있던게 맞나 싶을 정도로, 헷갈렸다....
while
: 각 반복이 시작하기 전에 조건을 확인do..while
: 각 반복이 끝난 후에 조건을 확인for(;;)
: 각 반복이 시작하기 전에 조건을 확인, 추가 세팅 가능✏️ while 반복문의 출력값 예상하기
let i = 0;
while (++i < 5) alert( i );
// 1, 2, 3, 4
➡️ 먼저 증가 시키고 비교, 1부터 비교하고 1을 출력
let i = 0;
while (i++ < 5) alert( i );
// 1, 2, 3, 4, 5
➡️ 증가 전 0 부터 비교 시키고, 1을 출력
결국 4를 비교시키고, 5까지 출력시킨다.
✏️ for 반복문의 출력값 예상하기
for (let i = 0; i < 5; i++) alert( i );
for (let i = 0; i < 5; ++i) alert( i );
// 둘 다 0부터 4까지 출력
0부터 비교, 0이 5보다 작으면 alert에 0을 띄운 후, 1을 더하기 때문에
후위형이나 전위형이나 일치한 결과 값이 나온다.
✏️ 'for' 반복문을 'while' 반복문으로 바꾸기
for (let i = 0; i < 3; i++) {
alert( `number ${i}!` );
}
➡️
let i = 0;
while ( i < 3) {
alert(`number ${i}!`);
i++
}
변수 i 에 0을 할당 시키고,
i 가 3보다 작을때, alert 창을 띄운후,
i를 증가시킨다.
✏️ 사용자가 유효한 값을 입력 할때까지 프롬프트 창 띄우기
let num;
do {
num = prompt("100을 초과하는 숫자를 입력해주세요.",0
} while (num <= 100 && num);
두 조건이 모두 truthy인 경우 프롬프트 창이 뜨게 한다.
num이 100보다 작거나, num이 null이면 프롬프트 창이 계속 나와야한다.
복수의 if 조건문은 switch문으로 바꿀 수 있다.
문법
swith문은 하나 이상의 case문으로 구성
첫번째 case문의 값과 일치 비교후, 두번째 case 값과 일치비교
해당
일치하는 값을 찾으면 해당 case문의 아래 코드가 실행된다.
break문을 만나거나, switch문이 끝나면 코드의 실행은 멈춘다.
✏️ 'switch'문을 'if'문으로 변환하기
switch (browser) {
case 'Edge':
alert( "Edge를 사용하고 계시네요!" );
break;
case 'Chrome':
case 'Firefox':
case 'Safari':
case 'Opera':
alert( '저희 서비스가 지원하는 브라우저를 사용하고 계시네요.' );
break;
default:
alert( '현재 페이지가 괜찮아 보이길 바랍니다!' );
}
➡️
if (browser === 'Edge')
alert("Edge를 사용하고 계시네요!")
else if (browser === 'Chrome' ||browser === 'Firefox' || browser === 'Safari' || browser === 'Opera') {
alert("저희 서비그가 지원하는 브라우저를 사용하고 계시네요.")}
else {
alert("현재 페이지가 괜찮아 보이길 바랍니다!")
}
✏️ 'if'문을 'switch'문으로 변환하기
let a = +prompt('a?', '');
if (a == 0) {
alert( 0 );
}
if (a == 1) {
alert( 1 );
}
if (a == 2 || a == 3) {
alert( '2,3' );
}
➡️
let a = +prompt('a?', '');
switch (a)
case 0:
alert(0)
break;
case 1:
alert(1)
break;
case 2:
case 3:
alert('2,3')
break;
// break 걸어주는걸 까먹었다.
// 조건이 해당하면 결과 나오고 끝이니까
// break!!
💬 오늘의 느낀점
안다고 넘어가서 놓칠 부분이 많았던 거 같다.
차근차근 다시 배웠던걸 상기시키면서 이제 까먹지 말고 꼭 기억하고 자유롭게 쓸 수 있도록 하자!