자바스크립트 형변환

고연주·2020년 11월 3일
0
// 형변환
// 문자형으로 변환
let value = true;
console.log(typeof value); // boolean

value = String(value); // String(value) 함수는 호출하여 전달받은 값을 문자열로 변환
console.log(typeof value); // string

// 숫자형으로 변환
console.log("6" / "2"); // 3, 문자열이 숫자형으로 자동변환된 후 연산이 수행

// 숫자형 값을 사용해 무언가를 하려고 하는데 그 값을 문자 기반 폼(form)을 통해 입력받는 경우, 명시적 형변환 필수
let str = "123";
console.log(typeof str); // string
str = Number(str); // 문자열 "123"이 숫자 123으로 변환        
console.log(typeof str); // number

let age = Number("임의의 문자열 123");
console.log(age); // NaN, 숫자 이외의 글자가 들어가 있는 문자열을 숫자형으로 변환할 경우 그 결과는 NaN

console.log(Number("      123       ")); // 123
console.log(Number("123z")); // NaN, z를 숫자로 변환하는데 실패함
console.log(Number(true)); // 1
console.log(Number(false)); // 0
console.log(Number(null)); // 0
console.log(Number(undefined)); // NaN

// 불린(boolean)형으로 변환
// 숫자 0, 빈 문자열, null, undefined, NaN과 같이 직관적으로도 비어있다고 느껴지는 값들은 false, 그 외의 값은 true
console.log(Boolean(1)); // true
console.log(Boolean(0)); // false
console.log(Boolean("hello")); // true
console.log(Boolean("")); // false
console.log(Boolean("0")); // true, 문자열 "0"은 true
console.log(Boolean(" ")); // true, 공백이 있는 문자열도 비어있지 않은 문자열이기 때문에 true

console.log("" + 1 + 0); // "10", 피연산자 중 하나가 문자열인 "" + 1에서 1은 문자형으로 변환, 공백과 문자열 1을 더한 "1", "1" + 0도 문자형으로 변환
console.log("" - 1 + 0); // -1, 빈 문자열은 숫자 0으로 변환
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, 피연산자 중 하나가 문자열이므로 숫자 5가 문자열로 변환
console.log("  -9  " - 5); // -14, 뺄셈 연산자는 인수를 숫자형으로 변환시키므로 -9 - 5 = -14
console.log(null + 1); // 1, 숫자형으로 변환 시 null은 0
console.log(undefined + 1); // NaN, undefined는 숫자형으로 변환 시 NaN
console.log(" \t \n" - 2); // -2, " \t \n"는 숫자형으로 변환 시 길이가 0인 문자열로 취급되어 숫자 0

// 덧셈 고치기
let f = +prompt("덧셈할 첫번째 숫자를 입력해주세요.", 1);
let g = +prompt("덧셈할 두번째 숫자를 입력해주세요.", 2);

console.log(f + g);

0개의 댓글