Sunday, April 15, 2007
자바스크립트] 퍼센트 증가-감소, 백분율 인상-인하 계산; JavaScript Percent Increase Decrease
자바스크립트에서 어떤 숫자를 몇 퍼센트 증가시키거나 또는 감소시키는 방법입니다. 별도의 함수가 제공되지 않기에, 아래 예제처럼 간단한 공식을 사용하여 계산합니다.
그런데 자바스크립트는 실수 숫자 처리에 좀 문제가 있습니다. 그래서 소수점 이하 2자리까지만 나오도록, roundXL()이라는 반올림 함수를 사용하여 조정해 주었습니다.
소스 파일명: example.html
(※ 스크롤 박스 사용법: 박스 안을 마우스로 클릭한 후, 키보드의 좌우 화살표키를 누르면 양옆으로 움직일 수 있습니다. 박스에서 다시 나오려면, 박스 바깥의 아무곳이나 클릭하면 됩니다.)
퍼센트 증가 감소 / 인상 인하 계산기 (온라인 버전): ▶▶ 퍼센트 증가 감소 계산기, % 인상 인하, 퍼센트 증감 계산기; Percent Increase Decrease Calculator
퍼센트 계산의 기초입니다: ▶▶ 자바스크립트] 퍼센트 계산, 백분율 구하기 소스; Percent JavaScript
그런데 자바스크립트는 실수 숫자 처리에 좀 문제가 있습니다. 그래서 소수점 이하 2자리까지만 나오도록, roundXL()이라는 반올림 함수를 사용하여 조정해 주었습니다.
JavaScript: 퍼센트 증감 계산 예제
소스 파일명: example.html
(※ 스크롤 박스 사용법: 박스 안을 마우스로 클릭한 후, 키보드의 좌우 화살표키를 누르면 양옆으로 움직일 수 있습니다. 박스에서 다시 나오려면, 박스 바깥의 아무곳이나 클릭하면 됩니다.)
<script type="text/javascript">
////////////////////////////////////////
// 숫자를 몇 퍼센트 증가
// 공식은 '숫자 * (1 + 퍼센트 / 100)'
////////////////////////////////////////
// 100을 10퍼센트 증가
var result;
result = 100 * (1 + 10 / 100);
document.write(result, '<br />');
// 출력 결과: 110.00000000000001
// 정확히 110 이 되어야 하지만, 깔끔하지 못하게 출력되었습니다.
// 100을 100퍼센트 증가
document.write( 100 * (1 + 100 / 100) , '<br />');
// 출력 결과: 200
// 100을 200퍼센트 증가 (100의 200% 증가는, 200이 아니라 300입니다)
document.write( 100 * (1 + 200 / 100) , '<br />');
// 출력 결과: 300
// 1548을 66퍼센트 증가
result = 1548 * (1 + 66 / 100);
document.write(roundXL(result, 2), '<br />');
// 출력 결과: 2569.68
// 이번에는 2569.6800000000003 이런 값이 나오기에
// roundXL함수를 사용하여, 소수점 2자리까지만 나오게 했음
// 6500을 15퍼센트 증가
result = 6500 * (1 + 15 / 100);
document.write(roundXL(result, 2), '<br />');
// 출력 결과: 7475
// 탁상용 계산기는, '6500 + 15%'로 계산 가능
////////////////////////////////////////
// 숫자를 몇 퍼센트 감소
// 공식은 '숫자 * (1 - 퍼센트 / 100)'
////////////////////////////////////////
// 100을 10퍼센트 감소
result = 100 * (1 - 10 / 100);
document.write(result, '<br />');
// 출력 결과: 90
// 100을 200퍼센트 감소
result = 100 * (1 - 200 / 100);
document.write(result, '<br />');
// 출력 결과: -100
// 1548을 66퍼센트 감소
result = 1548 * (1 - 66 / 100);
document.write(roundXL(result, 2), '<br />');
// 출력 결과: 526.32
// 7600을 25퍼센트 감소
document.write( 7600 * (1 - 25 / 100) , '<br />');
// 출력 결과: 5700
// 탁상용 계산기는, '7600 - 25%'로 계산 가능
// 엑셀 스타일의 반올림 함수 정의
// 자바스크립트는 실수 출력에 좀 문제가 있어서
// 이런 함수를 사용하여, 숫자를 다듬어 주어야 합니다
function roundXL(n, digits) {
digits = Math.pow(10, digits);
return Math.round(n * digits) / digits;
}
</script>
////////////////////////////////////////
// 숫자를 몇 퍼센트 증가
// 공식은 '숫자 * (1 + 퍼센트 / 100)'
////////////////////////////////////////
// 100을 10퍼센트 증가
var result;
result = 100 * (1 + 10 / 100);
document.write(result, '<br />');
// 출력 결과: 110.00000000000001
// 정확히 110 이 되어야 하지만, 깔끔하지 못하게 출력되었습니다.
// 100을 100퍼센트 증가
document.write( 100 * (1 + 100 / 100) , '<br />');
// 출력 결과: 200
// 100을 200퍼센트 증가 (100의 200% 증가는, 200이 아니라 300입니다)
document.write( 100 * (1 + 200 / 100) , '<br />');
// 출력 결과: 300
// 1548을 66퍼센트 증가
result = 1548 * (1 + 66 / 100);
document.write(roundXL(result, 2), '<br />');
// 출력 결과: 2569.68
// 이번에는 2569.6800000000003 이런 값이 나오기에
// roundXL함수를 사용하여, 소수점 2자리까지만 나오게 했음
// 6500을 15퍼센트 증가
result = 6500 * (1 + 15 / 100);
document.write(roundXL(result, 2), '<br />');
// 출력 결과: 7475
// 탁상용 계산기는, '6500 + 15%'로 계산 가능
////////////////////////////////////////
// 숫자를 몇 퍼센트 감소
// 공식은 '숫자 * (1 - 퍼센트 / 100)'
////////////////////////////////////////
// 100을 10퍼센트 감소
result = 100 * (1 - 10 / 100);
document.write(result, '<br />');
// 출력 결과: 90
// 100을 200퍼센트 감소
result = 100 * (1 - 200 / 100);
document.write(result, '<br />');
// 출력 결과: -100
// 1548을 66퍼센트 감소
result = 1548 * (1 - 66 / 100);
document.write(roundXL(result, 2), '<br />');
// 출력 결과: 526.32
// 7600을 25퍼센트 감소
document.write( 7600 * (1 - 25 / 100) , '<br />');
// 출력 결과: 5700
// 탁상용 계산기는, '7600 - 25%'로 계산 가능
// 엑셀 스타일의 반올림 함수 정의
// 자바스크립트는 실수 출력에 좀 문제가 있어서
// 이런 함수를 사용하여, 숫자를 다듬어 주어야 합니다
function roundXL(n, digits) {
digits = Math.pow(10, digits);
return Math.round(n * digits) / digits;
}
</script>
퍼센트 증가 감소 / 인상 인하 계산기 (온라인 버전): ▶▶ 퍼센트 증가 감소 계산기, % 인상 인하, 퍼센트 증감 계산기; Percent Increase Decrease Calculator
퍼센트 계산의 기초입니다: ▶▶ 자바스크립트] 퍼센트 계산, 백분율 구하기 소스; Percent JavaScript
tag: html
HTML | CSS | 자바스크립트 JavaScript
<< Home