TIL 2021.09.29 - 2주차 ✏️

📍이번주 학습 목표

• JavaScript 기초 문법 공부하기
• DOM과 이벤트 동작 방법 이해하기
• 제이쿼리 사용 방법 공부하기
• 자료구조의 개념 공부하기
  
  

  오늘 배운 내용 💪

  • Javascript 기초 문법 공부하기

<오늘 복습할 내용>
1. 자바 스크립트

오늘 수업에서는 데이터타입, 연산자, 반복문, 조건문과 같은 자바스크립트의 기초 문법에 대해서 공부를 했다. 오늘은 암묵적 타입 변환에 대해서 자세히 공부를 해보자.

// 사칙 연산에 대해서 공부 할때
//문자열에서 +는 문자열로 출력하지만 다른 사칙연산의 경우는 임의로 계산해서 출력한다.

"0" + "1" = "01";
"1" - "0" = 0
"2" * "2" = 4
"4" / "2" = 2

그렇다면 다른 경우는 어떻게 되는걸까?

암묵적 타입 변환

= 자바 스크립트 엔진은 표현식을 평가 할 때 문맥을 고려해 암묵적으로 데이터 타입을 강제 변환 할 때가 있다. 이와 같이 암묵적 타입 변환의 결과를 예상하지 못하고 사용하게 되면 에러를 발생할 수 있기 때문에 자바스크립트에서 어떤식으로 암묵적 타입 변환이 일어나는지 살펴볼 필요가 있다.

문자열 타입으로 변환

//숫자 타입
1 + '2' 		// -> "12"
`1 + 1 = ${1 + 1}`	// -> "1 + 1 = 2"
0 + '' 			// -> "0"
-0 + ''			// -> "0"
1 + ''			// -> "1"
-1 + ''			// -> "-1"
NaN + ''		// -> "NaN"
Infinity + ''		// -> "Infinity"
-Infinity + '' 		// -> "-Infinity"

//불리언 타입
true + ''		// -> "true"
false + ''		// -> "false"

//null 타입
null + ''		// -> "true"

//undefined 타입
undefined + ''		// -> "undefined"

//심벌 타입
(Symbol()) + ''		// -> TypeError

//객체 타입
({}) + ''		// -> "[object Object]"
Math + ''		// -> "[object Math]"
[] + ''			// -> ""
[10, 20] + ''		// -> "10,20"
(function(){}) + ''	// -> "function(){}"
Array + ''		// -> "function Array() { [native code] }"

숫자 타입으로 변환

1 - '1' 		// -> 0
1 * '10'		// -> 10
1 / 'one'		// -> NaN
'1' > 0			// -> true

//문자열 타입
+''			// -> 0
+'0'			// -> 0
+'1'			// -> 1
+'string'		// -> NaN

//불리언 타입
+true			// -> 1
+false 			// -> 0

//null 타입
+null			// -> 0

//undefined 타입
+undefined		// -> NaN

//심벌 타입
+symbol()		// -> TypeError

// 객체 타입
+{}			// -> NaN
+[]			// -> 0
+[10, 20]		// -> NaN
+(function(){})		// -> NaN

출처: '모던 자바스크립트 Deep Dive'(이웅모 저)

물론, 다 기억을 못하겠지만 수시로 들어와서 눈에 익혀서 생각한대로 출력 값이 나오지 않아 에러가 생기는 일이 일어나지 않도록 주의해야겠다!