2021-08-10js筆記2

參考W3School檔案

JavaScript Math 物件

Math 方法
1.Math.round(x) 的回傳值是 x 四舍五入為最接近的整數，
2.Math.pow(x, y) 的回傳值是 x 的 y 次冪，
3.Math.sqrt(x) 回傳 x 的平方根，
4.Math.abs(x) 回傳 x 的絕對（正）值，
5.Math.ceil(x) 的回傳值是 x 上舍入最接近的整數，
6.Math.floor(x) 的回傳值是 x 下舍入最接近的整數，

<p>Math.floor(x) 回傳 x 被下舍入為最接近整數的值：</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Math.floor(4.7);
</script>

7.Math.sin(x) 回傳角 x（以弧度計）的正弦（介于 -1 與 1 之間的值），

<p>Math.sin(x) 回傳 x（以弧度計）的正弦：</p>

<p>以弧度計的角度 = (以度數計的角度) * PI / 180，</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"The sine value of 90 degrees is " + Math.sin(90 * Math.PI / 180);
</script>

8.Math.cos(x) 回傳角 x（以弧度計）的余弦（介于 -1 與 1 之間的值），

<p>Math.cos(x) 回傳 x（以弧度計）的余弦：</p>

<p>以弧度計的角度 = (以度數計的角度) * PI / 180，</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"The cosine value of 0 degrees is " + Math.cos(0 * Math.PI / 180);
</script>

Math 屬性（常量）JavaScript 提供了可由 Math 物件訪問的 8 個數學常量：
Math.E // 回傳歐拉指數（Euler’s number）
Math.PI // 回傳圓周率（PI）
Math.SQRT2 // 回傳 2 的平方根
Math.SQRT1_2 // 回傳 1/2 的平方根
Math.LN2 // 回傳 2 的自然對數
Math.LN10 // 回傳 10 的自然對數
Math.LOG2E // 回傳以 2 為底的 e 的對數（約等于 1.414）
Math.LOG10E // 回傳以 10 為底的 e 的對數（約等于0.434）

JavaScript 隨機

Math.random() 與 Math.floor() 一起使用用于回傳隨機整數，

<p>Math.floor(Math.random() * 10) 回傳 0 與 9 之間的隨機整數（均包含）：</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
Math.floor(Math.random() * 10);
</script>

JavaScript 邏輯

JavaScript 布爾（邏輯）代表兩個值之一：true 或 false，您可以使用 Boolean() 函式來確定運算式（或變數）是否為真，

<p>顯示 Boolean(10 > 9) 的值：</p>

<button onclick="myFunction()">試一試</button>

<p id="demo"></p>

<script>
function myFunction() {
  document.getElementById("demo").innerHTML = Boolean(10 > 9);
}
//回傳true
</script>

比較運算子

js比較

條件（三元）運算子

<p>輸入您的年齡然后點擊這個按鈕：</p>

<input id="age" value="18" />

<button onclick="myFunction()">試一試</button>

<p id="demo"></p>

<script>
function myFunction() {
  var age, voteable;
  age = document.getElementById("age").value;
  voteable = (age < 18) ? "好年輕":"夠成熟";
  document.getElementById("demo").innerHTML = voteable;
}
</script>

JavaScript If…Else 陳述句

使用 if 來規定要執行的代碼塊，如果指定條件為 true
使用 else 來規定要執行的代碼塊，如果相同的條件為 false
使用 else if 來規定要測驗的新條件，如果第一個條件為 false
使用 switch 來規定多個被執行的備選代碼塊

<p>單擊按鈕以顯示基于時間的問候語：</p>

<button onclick="myFunction()">試一試</button>

<p id="demo"></p>

<script>
function myFunction() {
  var greeting;
  var time = new Date().getHours();
  if (time < 10) {
    greeting = "早安";
  } else if (time < 20) {
    greeting = "日安";
  } else {
    greeting = "晚安";
  }
  document.getElementById("demo").innerHTML = greeting;
}
</script>

JavaScript Switch 陳述句

計算一次 switch 運算式
把運算式的值與每個 case 的值進行對比
如果存在匹配，則執行關聯代碼

<p id="demo"></p>

<script>
var day;
switch (new Date().getDay()) {
  case 0:
    day = "周日";
    break;
  case 1:
    day = "周一";
    break;
  case 2:
    day = "周二";
    break;
  case 3:
    day = "周三";
    break;
  case 4:
    day = "周四";
    break;
  case 5:
    day = "周五";
    break;
  case  6:
    day = "周六";
}
document.getElementById("demo").innerHTML = "今天是" + day;
</script>

JavaScript For 回圈

假如您需要運行代碼多次，且每次使用不同的值，那么回圈（loop）相當方便使用，
js支持多種不同的型別的回圈
for - 多次遍歷代碼塊
for/in - 遍歷物件屬性
while - 當指定條件為 true 時回圈一段代碼塊
do/while - 當指定條件為 true 時回圈一段代碼塊
注意：
break 陳述句“跳出”回圈，
continue 陳述句“跳過”回圈中的一個迭代，

<h1>JavaScript 回圈</h1>
<p id="demo"></p>
<p id="demo2"></p>
<script>
//for回圈
var cars = ["BMW", "Volvo", "porsche", "Ford", "Fiat", "Audi"];
var text = "";
var i;
for (i = 0; i < cars.length; i++) {
  text += cars[i] + "<br>";
}
document.getElementById("demo").innerHTML = text;
//while回圈
var texts = "";
var i = 0;
while (i < 10) {
  text += "<br>數字是 " + i;
  i++;
}
document.getElementById("demo2").innerHTML = texts;
</script>

JavaScript 資料型別

JavaScript 中有五種可包含值的資料型別：
字串（string）
數字（number）
布爾（boolean）
物件（object）
函式（function）
有三種物件型別：
物件（Object）
日期（Date）
陣列（Array）
有兩種不能包含值的資料型別：
null
undefined
請注意：
NaN 的資料型別是數值
陣列的資料型別是物件
日期的資料型別是物件
null 的資料型別是物件
未定義變數的資料型別是 undefined
尚未賦值的變數的資料型別也是 undefined