명시적 형변환 vs 암시적 형변환

문자형으로 변환

• 명시적 형변환
  String()

// ex)
let val = true; // boolean
console.log(String(val)); // 문자형됨

• 암시적 형변환
  '' +하기

// ex)
let val = true;	// boolean
console.log(val + 'apple') // 'trueapple' 문자형으로 형변환됨

---

숫자형으로 변환

• 명시적 형변환

Number(문자);

// ex)
let str = "123";
console.log(Number(str)); // 123 숫자형됨

parseInt(문자, 진법);

// ex)
let str = '100';
console.log(parseInt(str, 10)); // 100 숫자형됨

parseFloat(문자, 진법);

// ex)
let str = '100.12';
console.log(parseInt(str, 10)); // 100.12 숫자형됨

• 암시적 형변환

// ex)
console.log(+"6"); 			// 6 숫자형됨
console.log("6" - "2"); 	// 4 숫자형됨
console.log("6" / "2"); 	// 3 숫자형됨
console.log("6" % "2"); 	// 0 숫자형됨
console.log("6" * "2"); 	// 12 숫자형됨
console.log("6" ** "2"); 	// 36 숫자형됨
console.log(+true); 		// 1 숫자형됨
console.log(+""); 			// 0 숫자형됨
console.log(+''); 			// 0 숫자형됨

📍 주의)

• 숫자 이외의 글자가 들어간 문자열을 숫자형으로 변환하려고 하면 NaN됨

// ex)
let age = Number("나이는 25");
console.log(age); // NaN

• 숫자형으로 변환 시 주의

undefined → NaN
null → 0
true → 1

// ex)
Number(true) );        // 1

false → 0

// ex)
Number(false) );       // 0

string → 처음과 끝 공백 제거 후 남은 문자열 없으면 0, 그렇지 않다면 문자열에서 숫자 읽음

// ex)
Number("123z") );      // NaN ("z"를 숫자로 변환하는 데 실패함)
Number("   123   ") ); // 123

---

boolean으로 변환

• 명시적 형변환
  Boolean()
  
  

• 형 변환 후 false인 값
  false: 명시적으로 거짓인 값.
  0: 숫자 0.
  -0: 음수 0.
  0n: 빅인트(BigInt) 0.
  null: 널 값.
  undefined: 정의되지 않은 값.
  NaN: 숫자가 아님(Not a Number).
  "" or '': 빈 문자열.
  
  

📍주의)

Boolean(''); // false
Boolean(' '); // true
Boolean('0'); // true

• 암시적 형변환
  값 앞에 !!을 붙여주면 true/false 값을 알려줌

// ex)
consle.log(!!0);	// false
consle.log(!!'');	// false
consle.log(!!NaN);	// false
consle.log(!!239);	// true
consle.log(!!'apple');	// true

---

암시적 형 변환 문제

문제

console.log("" + 1 + 0);
console.log("" - 1 + 0);
console.log(true + false);
console.log(6 / "3");
console.log("2" * "3");
console.log(4 + 5 + "px");
console.log("$" + 4 + 5);
console.log("4" - 2);
console.log("4px" - 2);
console.log(7 / 0);
console.log("  -9  " + 5);
console.log("  -9  " - 5);
console.log(null + 1);
console.log(undefined + 1);
console.log(" \t \n" - 2);

답

console.log("" + 1 + 0);    // "10"
console.log("" - 1 + 0);    // -1
console.log(true + false);  // 1
console.log(6 / "3");       // 2
console.log("2" * "3");     // 6
console.log(4 + 5 + "px");  // "9px"
console.log("$" + 4 + 5);   // "$45"
console.log("4" - 2);       // 2
console.log("4px" - 2);     // NaN
console.log(7 / 0);         // Infinity
console.log("  -9  " + 5);  // " -9  5 "
console.log("  -9  " - 5);  // -14
console.log(null + 1);      // 1
console.log(undefined + 1); // NaN
console.log(" \t \n" - 2);  // -2