数値(浮動小数)の切り捨て、切り上げ、丸め込み(四捨五入) - JavaScript

JavaScriptでの浮動小数点の切り捨て、切り上げをする方法です。

数値の切り捨て

JavaScriptで数値を切り捨てる場合は Math.floor() メソッドを用います。

書式

Math.floor([切り捨てしたい小数値]);

コード例

  var result = Math.floor(val);

数値の切り上げ

JavaScriptで数値を切り上げる場合は Math.ceil() メソッドを用います。

書式

Math.ceil([切り上げしたい小数値]);

コード例

  var result = Math.ceil(val);

数値の丸め込み (四捨五入)

JavaScriptで数値を四捨五入する場合は Math.round() メソッドを用います。

書式

Math.round([四捨五入したい小数値]);

コード例

  var result = Math.round(val);

プログラム例

コード

下記のHTMLファイルを作成します。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
  <script type="text/javascript">
    function ceilProc() {
      var val = document.getElementById("Text1").value;
      var result = Math.ceil(val);
      document.getElementById("output").innerText = "切り上げ値:" + result;
    }
    function floorProc() {
      var val = document.getElementById("Text1").value;
      var result = Math.floor(val);
      document.getElementById("output").innerText = "切り捨て値:" + result;
    }
    function roundProc() {
      var val = document.getElementById("Text1").value;
      var result = Math.round(val);
      document.getElementById("output").innerText = "四捨五入値:" + result;
    }
  </script>
</head>
<body>
  <input id="Text1" type="text" /><br />
  <br/>
  <input id="Button1" type="button" value="Ceil" onclick="ceilProc();" />&nbsp;
  <input id="Button2" type="button" value="Floor" onclick="floorProc();" />&nbsp;
  <input id="Button3" type="button" value="Round" onclick="roundProc();" /><br />
  <br />
  <div id="output"></div>
</body>
</html>

解説

ボタンクリックにより、JavaScriptの関数が呼び出されます。関数内では"Text1"のテキストボックスから値を読み込み、ceilProc関数で鵜は小数の切り上げ、floorProc関数では少数の切り捨て、roundProc関数では四捨五入の処理を実行します。結果をid="output"のdiv枠に出力します。