//tips
//js理解継続
画面表示で数字を任意の少数点で切り捨てる方法を確認する。円周率が使いやすいのでMath.PIの円周率を用いて考えていく。
<section>
<p>円周率は<span id=“pi”></span>です。</p>
<p>切り捨てると<span id=“floor”></span>です。</p>
</section>
<script>
‘use strict’;
document.getElemntById(‘pi’).textContent=Math.PI;
document.getElemntById(‘floor’).textContent=Math.floor(Math.PI);
</script>
Math.floor(数値)で小数点以下を切り捨てることができる。
小数点第二位以下を切り捨てたい場合は、自身でfunctionを作成する必要があり、
<script>
‘use strict’;
document.getElemntById(‘pi’).textContent=Math.PI;
document.getElemntById(‘floor’).textContent=Math.floor(Math.PI);
function point(num,digit)
{
const mover = 10 **digit;
return Math.floor(num*mover)/mover;
}
</script>
numで切り捨てたい数字の引数を取得し、digitで第何位までの数値を残すかを決めている。
これをhtmlに反映させたいので
<section>
<p>円周率は<span id=“pi”></span>です。</p>
<p>切り捨てると<span id=“floor”></span>です。</p>
<p>小数第2位で切り捨てると<span id=“output”></span>です。</p>
</section>
<script>
‘use strict’;
document.getElemntById(‘pi’).textContent=Math.PI;
document.getElemntById(‘floor’).textContent=Math.floor(Math.PI);
function point(num,digit)
{
const mover = 10 **digit;
return Math.floor(num*mover)/mover;
}
document.getElementById(‘output’).textContent=point(Math.PI,2);
</script>
このようにpoint(Math.PI,2);を使用すればきちんと小数切り捨て計算された数字を取得できる。
またa**bとすることでaをb乗できる。
前回述べたようにMathオブジェクトのプロパティは全て読み取り専用であり、Math.PIのように答えが一つであり、書き換えられては困るものであることが要因である。
以前出てきたMath.random()は０以上１未満の乱数を発生させるメソッドであったが、Math.floor(Math.random()*1)+1のようにすることでランダム生成する値を1以上の整数に直して扱えるようになる。
もし先頭に0をつけて常に２桁で表示させたい場合は
document.getElementById(‘min’).textContent = String(counter[2]).padStart(2,’0’);
文字列.padStart(揃える文字数,埋め合わせ用の文字)とすることで基準にみたない場合には先頭に0を加えて表示できる。ただ、条件が文字列であることなのでString内のパラメータとして数字を組み込むことになる。
