BMI値計算プログラム

Mar 22, 2016

BMI値計算プログラム

2016-03-22 最終更新日:2016-03-22
js bmi health web walking running sports 計算

健康志向のブームはいつもありますね。健康に気を使う人多いと思います。

運動してダイエットとかもそうですよね。テレビでもよくやっています。健康な身体作り。

身体が資本というのは病気になって初めて分かるものです。私もあまり運動していないので身体もたるみっぱなしで最近は完全に引きこもり生活です。パソコンでの作業が多いのであまり運動することがないのです。

座りっぱなしもよくないということなのでスタンディングワークしております。何年か前にもやりましたが1ヶ月ほどで1kgはやせました。最近はずっと立ちっぱなしで大変なのでスタンディングワークを多めで座って作業もしています。

病気をしない身体作りというのはとても良いことですね。背筋ともも肉を鍛えるとダイエットには効果的と効いたことがあります。


スポンサーリンク


さてBMIという言葉をご存じな方も多いと思います。

BMI(Body Mass Index)は国際的な肥満度を測る指数のことで脂肪指数とも呼ばれています。

計算式が分かるのでこれをjavascriptで計算させてみたいと思います。 体重÷(身長(m)x身長(m))が式です。

/*
  	BMI計算式
  	体重 ÷ ((身長cm÷100) x (身長cm÷100))
   */
  bmi = function(height, weight) {
    var h, total;
    h = height / 100;
    total = weight / (h * h);
    return Math.round(total * 10) / 10;
  };
  bmi(170,70);
  // => 24.2

関数の中に身長と体重を入れると計算が出来るようになっています。

身長をcmの入力と考えてまず100で割っています、それをかけて体重で割ります。

最後の行Math.round(total * 10) / 10はMath.round(x)の関数で四捨五入します。わざわざ10かけて10で割っているのは少数の値を出すためにやっています。

因みにMath.ceil(x)関数で切り上げでMath.floor(x)関数切り捨てになります。

実際のスクリプトはエラー処理や理想の体重出力処理があるので多めなのですがBMI計算は上記のみです。

⇒デモを見てみる

実際の数値はいかがだったでしょうか? 私は23.4でした。一応標準数値内といったところでしょうか。

簡単なプログラムがあればまた紹介したいと思います。

下記をコピペで確認できます。

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>BMIサンプル</title>
</head>
<body>
<h1>BMI計算プログラム</h1>
<p><label for="height">身長cm</label><p>
<p><input type="text" class="form-control" id="bmi-height" placeholder="身長を入力"></p>
<p><label for="weight">体重kg</label></p>
<p><input type="text" class="form-control" id="bmi-weight" placeholder="体重を入力"></p>
<p><label for="bmi">BMI値</label></p>
<p id="results"></p>
<p id="ideal-weight"></p>
<button type="button" id="button">計算する</button>
<button type="reset" id="reset">リセット</button>

<script>
// Generated by CoffeeScript 1.10.0
(function() {
  'use strict';

  /*
  	変数初期化と各ID名設定
   */
  var bmi, btn, btn_id, esc, getValue, height_id, ideal_id, idealweight, reset, reset_id, resetbtn, results_id, showResult, weight_id;
  height_id = 'bmi-height';
  weight_id = 'bmi-weight';
  results_id = 'results';
  ideal_id = 'ideal-weight';
  btn_id = 'button';
  reset_id = 'reset';

  /*
  	BMI計算式
  	体重 ÷ (身長m x 身長m)
   */
  bmi = function(height, weight) {
    var h, total;
    h = height / 100;
    total = weight / (h * h);
    return Math.round(total * 10) / 10;
  };

  /*
  	理想のBMI体重
  	(身長m x 身長m) x 22-25
   */
  idealweight = function(height) {
    var h, ideal;
    ideal = [];
    h = height / 100;
    ideal.weight_first = (h * h) * 22;
    ideal.weight_last = (h * h) * 25;
    ideal.weight_first = Math.round(ideal.weight_first * 10) / 10;
    ideal.weight_last = Math.round(ideal.weight_last * 10) / 10;
    return "標準の体重は" + ideal.weight_first + "〜" + ideal.weight_last + "kgぐらいです";
  };

  /*
  	値判定
  	取得した値を数値化判定して数値なら計算
   */
  getValue = function() {
    var height, result, weight;
    result = [];
    height = esc(document.getElementById(height_id).value);
    weight = esc(document.getElementById(weight_id).value);
    height = parseInt(height, 10);
    weight = parseInt(weight, 10);
    if (!height || !weight) {
      result.bmi = '半角数値を入力してください!';
      result.ideal = 'Error!';
      return result;
    } else {
      result.bmi = bmi(height, weight);
      result.ideal = idealweight(height);
      return result;
    }
  };

  /*
  	計算結果を表示
   */
  showResult = function() {
    var ideal, results, total;
    total = getValue();
    results = document.getElementById(results_id);
    ideal = document.getElementById(ideal_id);
    results.innerHTML = "";
    ideal.innerHTML = "";
    results.innerText = total.bmi;
    ideal.innerText = total.ideal;
  };

  /*
  	リセット
   */
  reset = function() {
    document.getElementById(results_id).innerHTML = '?';
    document.getElementById(ideal_id).innerHTML = '?';
  };

  /*
  	HTMLエスケープ処理
   */
  esc = function(str) {
    str = str.replace(/&/g, '&amp;');
    str = str.replace(/</g, '&lt;');
    str = str.replace(/>/g, '&gt;');
    str = str.replace(/"/g, '&quot;');
    str = str.replace(/'/g, '&#39;');
    return str;
  };
  btn = document.getElementById(btn_id);
  resetbtn = document.getElementById(reset_id);
  btn.addEventListener("click", showResult, false);
  resetbtn.addEventListener("click", reset, false);
})();

</script>

</body>
</html>

Webの仕事をするならJavascriptは必須ですね。

ダウンロード


∞Tadashi Suyama∞

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

Similar Posts

最近の投稿

アイキャッチ
使いやすいメモツールDropBoxPaper

軽量なメモ帳はGoogleKeepを使っておりましたが[クラウド時代にオススメしたいメモアプリ](/blog/memo/2016/03/12/cloud-memo.html)で感想を述べておりま...

15 May 2017

アイキャッチ
みろくの里 ダイナソーパーク

行ってみた率直の感想は蒜山高原センタージョイフルパークと感じは似ています。昔ながらのアトラクションといった感じです。いつか来た道という昭和30年代の昔ながらの道といったところもあります。こどもは...

07 May 2017

アイキャッチ
テキスト選択させないCSS

今回はcssのプロパティのご紹介です。 サイトによってですが選択できないサイトとかを見たことがないでしょうか?あれ?選択できないぞ。。。 これはCSSで制御しているからなんです。いやJava...

30 Apr 2017

アイキャッチ
GIF Brewery3の使い方をご紹介

GIF Brewery3のご紹介です。Macしかないアプリです。そして有料です。600円 ビデオファイルからgifファイルを作成することができ、また、iOSやMac画面録画からGIFを作成する...

25 Apr 2017

アイキャッチ
オンラインツールPDF Candyのご紹介

アイスクリームアップス([Icecream Apps - Free & tasty software!](http://icecreamapps.com/))というソフトウェア開発の会社...

15 Apr 2017

著者

ウェブエンジニアのSUYAMAのブログです。

WEBに関することや個人的に関心のあることについて書きます。主に技術系ブログです。

タグクラウド

js bmi health web walking running sports 計算
フッターイメージ