JavaScript의 형변환
->자바스크립트는 타입이 유연한 언어이다.
자바스크립트 형 변환에는 자바스크립트 엔진이 필요에 따라 변환되는 암시적 변환과 개발자의 의도에 따라 변환되는 명시적 변환이 있다.
암시적 형 변환 ( lmplicit type conversion)
: 자바스크립트 엔진 필요에 따라 자동으로 데이터 타입이 변환 시키는 것
1)산술연산자
더하기 연산자(+)는 숫자보다 문자열이 우선시 된다. 때문에 숫자형+문자형이면 문자형으로 변환하여 연산된다.
number + number // number
number + string // string
string + string // string
string + boolean // string
number + boolean // number
50 + 50; //100
100 + “점”; //”100점”
“100” + “점”; //”100점”
“10” + false; //”100"
99 + true; //100
->다른 연산자(-, *, /, %)의 경우 숫자형이 문자형보다 우선시 되기 떄문에 더하기와 같은 문자형으로의 변환이 일어나지 않는다.
//다른 연산자(-,*,/,%)
string * number // number
string * string // number
number * number // number
string * boolean //number
number * boolean //number
“2” * false; //0
2 * true; //2
2)동치비교
엄격하지 않은 동치 (==), 아래의 예제는 모두 'ture'이다.
null == undefined
“0” == 0
0 == false
“0” == false
엄격한 동치(===)
엄격한 동치는 두 값 비교할 때 데이터 타입 변환하지 않는다.
명시적 형 변환(Explicit type conversion)
: 개발자가 의도를 가지고 데이터 타입을 변환 시킨 것이다.
기본적인 방법은 object(), Number(), toString(), Boolean() 와 같은 함수를 이용하는데, new연산자가 없다면 함수는 타입 변환하는 함수로써 사용.
자료형 -> 숫자형 (A Type -> Number Type)
1)Number()
:정수형과 실수형의 숫자로 변환한다.
보통 문자형을 숫자형으로 변경할 때 사용한다.
숫자로 반환되지 않으면 NaN(Not a Number)로 반환한다.
null, false, "빈문자열'에 대해서는 0으로 표현하며, truthy한 값은 1로 표현한다.
array의 경우는 Number()함수에서 사용하는 0을 반환한다.
Number(“12345”); //12345
Number(“2”*2); //4
const falsy1 = null;
Number(falsy1); // 0;
const falsy2 = '';
Number(falsy2); // 0;
const falsy3 = false;
Number(falsy3); // 0;
const truthy1 = [];
Number(truthy1); // 0;
const truthy2 = true;
Number(truthy2); // 1;
const truthy3 = {};
Number({}); // NaN;
2)parseInt()
:정수형의 숫자로 변환한다.
만약 문자열이 '숫자0'으로 시작하면, 8진수로 인식한다.
앞 부분 빈공백을 두고 나오는 문자는 모두 무시되어 NaN(Not a Number)을 반환한다.
*문자열로 된 부분에서 숫자(정수)만 뽑아서 변환해주는 것이 특징이다!
cf)Number은 문자열 전체가 숫자일때 소수점까지 숫자타입으로 가져온다
parseInt(“27”) //27
parseInt(0033); //27
parseInt(0x1b); //27
parseInt(“ 2”); //2
parseInt(“ 2ㅎ”); //2
parseInt(“ ㅎ2”); //NaN
3)parse Flooat()
: 부동 소수점까지 숫자로 변환한다.
항상 10진수를 쓰는 것이 parseInt()함수와 다른 점이다. 앞 부분 빈 공백을 두고 나오는 문자는 무시하고 NaN을 반환한다.
parseFloat(“!123”); //NaN
parseFloat(“123.123456”); //123.123456
parseInt(“123.123456”); //123
parseFloat(“ 123.123456”); //123.123456
parseFloat(“ a123.123456”); //NaN
4)단항 연산자(unary-operator)로 숫자타입 변경
Number와 동일한 동작을 한다.
자바스크립트 함수를 사용하지 않고 타입을 변환하는 효율적인 방법이다.
+'1000'; // 1000
+'-1000'; // -1000
+'Infinity'; // Infinity
-'1000'; // -1000
+true; // 1
+[]; /// 0
+false; // 0
+null; // 0
+'';// 0
자료형 -> 문자형(A Type -> String Type)
1)String()
String(123); //”123"
String(123.456); //”123.456"
2)toString()
:주어진 값을 문자열로 변환 후 반환한다.
인자로 기수를 선택 가능하다. 인자 전달하지 않으면 10진수로 변환한다.
var trans = 100;
trans.toString(); //”100"
trans.toString(2); //”1100100"
trans.toString(8); //”144"
var boolT = true;
var boolF = false;
boolT.toString(); //”true”
boolF.toString(); //”false”
3)toFixed()
:toFixed()에 인자를 넣으면 인자 값 만큼 반올림하여 소수점을 표현하며, 소수점 넘치는 값이 인자로 들어오며 0으로 길이를 맞춘 문자열을 반환한다.
var trans = 123.456789;
var roundOff = 99.987654;
trans.toFixed(); //”123"
trans.toFixed(0); //”123"
trans.toFixed(2); //”123.46"
trans.toFixed(8); //”123.45678900"
roundOff.toFixed(2); //”99.99"
roundOff.toFixed(0); //”100"
A type -> Boolean Type
자바스크립트에서 Boolean Type으로 변경은 Boolean 또는 부정연산자를 사용하여 Boolean값을 만들어낸다
부정연산자(!)는 '!'를 사용하면 반대값을 리턴한다.
1)Boolean
Boolean(100); //true
Boolean(“1”); //true
Boolean(true); //true
Boolean(Object); //true
Boolean([]); //true
Boolean(0); //false
Boolean(NaN); //false
Boolean(null); //false
Boolean(undefined); //false
Boolean( ); //false
const numb1 = 0;
Boolean(numb1); // false
!!numb1; // false
!numb1; // true
참고 :https://medium.com/gdana/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EC%9D%98-%ED%98%95%EB%B3%80%ED%99%98%EC%9D%80-%EB%91%90%EA%B0%80%EC%A7%80%EB%8B%A4-b46875be4a88
