데이터 타입의 종류로는 number, string, object, boolean, bigint 등이 있는데요
라우터 매개변수를 가져올수 있는 params는 데이터를 무조건 문자열로 받아옵니다.
app.get('products/:n', (요청, 응답)=>{ 응답.json({ num : 요청.params.n }) }) |
http://localhost:8080/products/10 {"num" : "10"} |
이렇게 params를 통해 데이터를 받으면 문자열로 들어오는데요.
string으로 들어왔지만 number 타입과 계산이 가능합니다. 바로 자바스크립트이기 때문인데요.
app.get('products/:n', (요청, 응답)=>{ 응답.json({ num : 요청.params.n - 10 }) }) |
http://localhost:8080/products/10 {"num" : 0} |
아니 그럼 string이어도 계산이 되니까 좋은거 아니냐 싶은 생각도 들텐데 javascript 언어 아닐때는 문제가 발생을 하게 됩니다. 때문에 자바스크립트에서도 데이터 타입은 최대만 맞추면서 작업하는게 다른언어 익힐때도 문제발생요소를 줄일수 있습니다.
그렇다면 어떻게 데이터 타입을 바꿀수 있을까요?
문자열로 나오는 숫자를 숫자형으로 바꾸는방법은 여러가지가 있지만 대체적으로 두가지를많이 사용합니다.
parseInt
parseInt는 문자열 인자를 파싱하여 특정 진수(수의 진법 체계에서 기준이 되는 값)의 정수를 반환하는데 사용이 됩니다.
예시를 보면서 이야기를 해보겠습니다.
console.log(parseInt('123')); // 123
console.log(parseInt('123', 16)); // 291
console.log(parseInt(' 123 ')); // 123
console.log(parseInt('077')); // 77
console.log(parseInt('1.9')); // 1
console.log(parseInt('xyz')); // NaN
첫번째 parseInt에 문자 123을 넣으면 숫자 123이 출력이 됩니다.
두번째 parseInt는 진수값을 입력하면 해당하는 진수값으로 계산을 합니다.
똑같은 123을 16진수로 나타내면 291이라는 값을 내보냅니다.
세번째와같은 공백이 존재하는 문자열의 경우 공백을 빼고 숫자만 인식하여 숫자의 값만 내보내기도 하고
앞의 0은 무시하여 0을 뺀 77만 숫자로 출력이 됩니다.
소수인 경우에는 정수값인 1만 출력이 되고
숫자형 문자열이 아니고 그냥 문자인 경우에는 NaN값으로 출력이 되는것을 확인 할 수 있습니다.
Number
Number()는 문자열을 숫자로 변환하는 함수입니다.
Number("123"); // 123
Number("12.3"); // 12.3
Number("12.00"); // 12
Number(""); // 0
Number(null); // 0
Number("xyz"); // NaN
Number(undefined); // NaN
첫번째 처럼 숫자형 문자열을 그대로 출력을하고
parseInt와 다르게 소숫점자리 그대로 출력을 하며
소숫점 뒤가 0일때에는 생략을 합니다.
특이한 점으로는 아무것도 입력을 하지 않거나 null을 입력을하면 0이 출력이 되는게 있습니다.
이렇게 parseInt와 Number를 알아보았는데요
이 둘의 차이점이 뭐가있을까요?
실행 | 결과 | 실행 | 결과 |
Number('1ver') | NaN | parseInt('1ver ') | 1 |
Number('1.23') | 1.23 | parseInt('1.23') | 1 |
Number('11') | 11 | parseInt('11',16) | 17 |
Number(true) Number("") Number(null) |
1 0 0 |
parseInt(true) parseInt("") parseInt(nulll) |
NaN NaN NaN |
1. Number는 숫자영 문자열만 받아오기 때문에 NaN을 가져오고 parseInt는 숫자가 앞쪽에 존재한다면 해당 숫자를 받아옵니다.
2. Number는 소숫점그대로 가져오지만 parseInt는 정수값만 가져옵니다.
3. Number는 진수를 표현할수 없고, parseInt는 두번째 인자값을 받아서 진수를 표현할 수 있습니다.
4. null, boolean, 빈값을 처리하여 숫자로 표현하지만 parseInt는 NaN값으로 출력을 합니다.