[JavaScript] 数値(浮動小数)の切り捨て、切り上げ、丸め込み(四捨五入)
このページのタグ:[JavaScript]
JavaScriptでの浮動小数点の切り捨て、切り上げをする方法です。

数値の切り捨て

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

コード例


  var result = Math.floor(val);

数値の切り上げ

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

コード例


  var result = Math.ceil(val);

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

JavaScriptで数値を四捨五入する場合は 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();" /> 
  <input id="Button2" type="button" value="Floor" onclick="floorProc();" /> 
  <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枠に出力します。

実行結果

上記のHTMLファイルをWebブラウザで表示します。下図の画面が表示されます。


テキストボックスに数値を入力します。


[Ceil]ボタンをクリックすると、切り上げた数値が下部に表示されます。


[Floor]ボタンをクリックすると、切り捨てた数値が下部に表示されます。


[Round]ボタンをクリックすると、四捨五入した数値が下部に表示されます。


別の数値に変更すると、その数値で計算されます。





プライバシー    iPentecについて
iPentec all rights reserverd. (ISDC)