[자바스크립트] parseInt와 Number의 차이

 

 

 

 

들어가며

알고리즘을 공부하면서, 가끔 parseInt를 써야 하는 경우와 Number를 써야 하는 경우는 언제인지 궁금했습니다. 이번 기회에 parseInt와 Number의 차이에 대해 정리해보면서, 언제 각각의 메서드를 사용해야 하는지 알 수 있었으면 좋겠습니다. 

 

 

 

 

 

 

 

 

 

 

 

 

 

---

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Number(str)

Number 메서드는 문자열을 인자로 받으면 해당 문자열을 숫자로 바꿔줍니다. 

 

아래의 코드는 '1234'라는 문자열을 1234라는 숫자로 형 변환하여 변수 num에 담는 코드입니다.

 

var num = Number('1234'); // 1234

 

하지만 아래처럼 문자열이 숫자가 아닌 경우 num에는 NaN이 저장됩니다.

 

var num = Number('1000원'); // NaN

 

만약 소수점은 어떻게 표시가 될까요? 이 경우엔, 10.123이 모두 표시가 되며, 숫자형으로 바뀌게 됩니다.

 

var num = Number('10.123'); // 10.123

 

 

 

 

 

 

 

 

---

 

 

 

 

 

 

 

 

 

 

 

 

parseInt(str)

기본적으로 Number(str)와 동일하게 문자열을 인자로 받으면 해당 문자열을 숫자로 바꿔줍니다. 

 

아래의 코드는 '1234'라는 문자열을 1234라는 숫자로 형 변환하여 변수 num에 담는 코드입니다.

 

var num = parseInt('1234'); // 1234

 

문자열이 숫자가 아닌 경우가 Number()와 조금 다른데, 문자열이 숫자로 시작하는 경우에는 숫자가 끝날 때까지만 형 변환을 하여 num에 저장됩니다. 시작이 숫자가 아니면 Number()와 마찬가지로 num이 NaN이 저장됩니다.

 

var num = parseInt('1000원'); // num에 1000이 저장
var num = parseInt('가격 : 1000원'); // num에 NaN이 저장

 

만약 소수점은 어떻게 표시가 될까요? 이 경우엔, 10.123에서 정수만 뽑아서 표시가 되며, 숫자형으로 바뀌게 됩니다.

 

var num = parseInt('10.123'); // 10

 

 

즉, parseInt와 Number은 비슷하면서도 다른 부분이 있었습니다. 둘 모두 숫자형으로 타입을 바꿔주지만, 문자열이 숫자로 시작하는 경우와 소수점을 표시하는 부분에 대해서는 차이점이 있으니, 이 차이를 알고 잘 활용한다면 좋을 듯싶습니다.

 

 

 

 

 

 

 

 

---

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

마치며

자바스크립트에 대해 공부하면서, 항상 타입스크립트를 공부하는 것도 좋지만, 먼저 자바스크립트의 기초부터 제대로 알아야겠다고 생각합니다. 이렇게 기초적인 부분을 습득하다 보면, 어느 순간 타입스크립트로 넘어갔을 때 훨씬 잘 이해할 수 있으리라 믿습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

---

 

 

 

 

 

 

 

 

 

 

 

 

 

출처

[자바스크립트] 형변환 Number() 와 parseInt() 의 차이