# IEH 程式隊 Workshop007 - 基礎程式4
## 線上網頁程式編輯器
(可使用10 Minute Email註冊: https://10minutemail.net/)
https://jsfiddle.net/
## 基礎網頁程式教學資源
https://www.w3schools.com/
## Developer 工具
popcat JS練習
```
javascript:(function() {
var event = new KeyboardEvent('keydown', {
key: 'g'
});
setInterval(function(){
for (i = 0; i < 100; i++) {
document.dispatchEvent(event);
}
}, 1000);
})();
```
## 變數 -> 資料結構
### Variable 變數
`const today = "Saturday";`
### Array 陣列
`const daysOfWeek = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
`
### JSON
https://tw.alphacamp.co/blog/json
```
{
"daysOfWeek": [
{ "index": 1, "short": "Mon", "full": "Monday" },
{ "index": 2, "short": "Tue", "full": "Tuesday" },
{ "index": 3, "short": "Wed", "full": "Wednesday" },
{ "index": 4, "short": "Thu", "full": "Thursday" },
{ "index": 5, "short": "Fri", "full": "Friday" },
{ "index": 6, "short": "Sat", "full": "Saturday" },
{ "index": 7, "short": "Sun", "full": "Sunday" }
]
}
```
## 資料結構:日期練習
請建立一個日期的JSON資料結構,最終呈現如下資料
提示:此練習會使用到 迴圈 以及 if-else 技巧
```
Monday (Mon) is a Weekday.
Tuesday (Tue) is a Weekday.
Wednesday (Wed) is a Weekday.
Thursday (Thu) is a Weekday.
Friday (Fri) is a Weekday.
Saturday (Sat) is a Weekend.
Sunday (Sun) is a Weekend.
```
```
const weekData = {
daysOfWeek: [
{ index: 1, short: "Mon", full: "Monday" },
{ index: 2, short: "Tue", full: "Tuesday" },
{ index: 3, short: "Wed", full: "Wednesday" },
{ index: 4, short: "Thu", full: "Thursday" },
{ index: 5, short: "Fri", full: "Friday" },
{ index: 6, short: "Sat", full: "Saturday" },
{ index: 7, short: "Sun", full: "Sunday" }
]
};
// Example usage: log each day with label "Weekday" or "Weekend"
weekData.daysOfWeek.forEach(day => {
const type = (day.short === 'Sat' || day.short === 'Sun') ? 'Weekend' : 'Weekday';
console.log(`${day.full} (${day.short}) is a ${type}.`);
});
```
### BMI計算機練習
* 使用HTML/CSS建構一個計算機外觀模板
* 使用JS建構一個計算機
條件:
* BMI=體重(公斤)÷身高(公尺)÷身高(公尺)
* 當BMI≧24為過重,≧27是輕度肥胖,>30是中度肥胖,在35以上就屬重度肥胖