웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리

HOME > js

자바스크립트 소수점 이하의 값만 구하는 방법

Last Modified : 2020-03-19 / Created : 2020-03-19
15,622
View Count

자바스크립트를 사용하여 소수점 이하의 값만 구하는 방법에 대하여 알아봅니다.




# 자바스크립트 소수점 이하의 값만 얻는 방법


정수가 아닌 실수의 숫자 값 중 소수점 이하의 값을 구하려고 합니다. 예를들어 10.234라는 숫자가 있다면 0.234의 값만 얻고 싶습니다. 이때 사용 가능한 방법이 바로 나머지를 구하는 방법입니다. 

생각해보면 간단합니다. 일단 1보다 큰 모든 숫자는 1로 나눌 수 있습니다. 그리고 1로 나눈 나머지는 0 이거나 0이 아닌 경우 소수점만 반환하게 됩니다.

- 1보다 큰 모든 숫자는 1로 나눌 수 있다.
- 나머지는 0이거나 0이 아닌 경우 소수점만 남게된다.

그럼 아래와 같은 방법으로 수수점을 구하게 될 것 입니다.

(소수점 구할 숫자 값) % 1


이제 위 방법을 사용하면 소수점만 값을 반환할 수 있겠죠.



! 소수점 구하기 예제 보기


그럼 몇 개의 문제를 만들어보고 결과를 알아봅니다. 간단한 수식으로 예제보다는 문제의 답을 구하는 것이 더 좋아보입니다.

  • 문제 1) 123.45
  • 문제 2) 9.99
  • 문제 3) 55.505
  • 문제 4) 0.2345
  • 문제 5) 0

위 문제의 소수점 자리만 구하면 아래와 같이 출력되어 나타납니다.
0.45000000000000284
0.9900000000000002
0.5050000000000026
0.2345
0

다만 보시는 것 뒤에 작은 숫자가 추가로 나타나게 되죠. 원하는 자리수만큼만 계산하면되므로 아래와 같이 필요 자리수까지만 구해야합니다.

1. 원하는 소수점으로 반환하기 toFixed(자리수)
2. 문자열 타입을 다시 숫자 타입으로 반환

이제 위 모든 과정을 간단하게 함수로 만들면 아래처럼 만들 수 있습니다.
getOnlyDecimal = function(_number, _length) {
  var result;
  result = _number % 1;
  result  = Number(result .toFixed(_length));
  return result;
};

소수점만 구하는 함수 getOnlyDecimal()가 모두 작성되었습니다. 그럼 아래에 값을 입력 후 반환되는 값을 확인해보세요.


! 소수점만 구하는 함수 동작해보기

아래에 숫자값을 입력하면 자동으로 소수점만 반환하게 됩니다. 이때 소수점은 3자리 까지만 반환하도록 했습니다.

Previous

[자바스크립트] 스크롤 이벤트에서 스크롤 방향 알아내는 방법

Previous

자바스크립트 배열에서 빈 값만 제거하기