JavaScript勉強日記#3

①繰り返し処理

<script>
  //console.log(1 + '枚');
  //console.log(2 + '枚');
  //console.log(3 + '枚');
  //console.log(4 + '枚');
  //console.log(5 + '枚');
  //console.log(6 + '枚');
  //console.log(7 + '枚');
  //console.log(8 + '枚');
  //console.log(9 + '枚');
  //console.log(10 + '枚');

素直に書く事もできるが記述が多くなってかなり面倒...

  'use strict';
  let i =1;
  while(i <= 10) {
    console.log(i + '枚');
    i += 1;
  }
</script>

while文を使う事で同じ記述を使わない様にできます。

②何回繰り返すかを決めずに繰り返し処理をする

<script>
'use strict';
let enemy = 100
let count = 0;
window.alert('戦闘開始！');

while(enemy > 0) {
  const attack = Math.floor(Math.random() * 30) + 1;
  console.log('怪物に' + attack + 'の損傷！');
  enemy = enemy - attack;
  count += 1
}
console.log(count + '回怪物討伐！')
</script>

③無限ループの抜け方
私は②のコードを書く時にenemy = enemy = attack;と書いてしまい無限ループに陥りましたので、ついでにループの抜け方(強制終了)も記載しておきます。
Macの場合はcommand + option + escでウィンドウを開き、WindowsはCtrl + Alt + Deleteでタスクマネージャーを開きます。

④functionの使い方
https://gyazo.com/1094994e4e432944c458459049c305b7

<section>
  <p id="output1"></p>
  <p id="output2"></p>
  <p id="output3"></p>
</section>
</main>

<script>
'use strict';

function total(price) {
  const tax = 0.1;
  return price + price * tax;
}
console.log('コーヒーメーカーの値段は' + total(8000) + '円です。');
document.getElementById('output1').textContent = 'コーヒーメーカーの値段は' + total(8000) + '円(税込)です。'
document.getElementById('output2').textContent = 'コーヒー豆の値段は' + total(900) + '円(税込)です。'
document.getElementById('output3').textContent = 'コーヒーフィルターの値段は' + total(250) + '円(税込)です。'

</script>

function total(price) {　加工の内容の記述(priceはこの中だけで使えます)　}
今回は、totalと言う名前のファンクションを使用しました。この記述以降total(price)の記述を書くと何度でも呼び出す事ができます。functionは資源です。