--- tags: JS 直播班 - 2021 秋季班 --- # 第二週小組任務 :::success ### 小組討論 - 本週討論時間:10/20 (三) 20:00 -21:00 - 討論連結:[會議連結](https://meet.google.com/oap-vedx-ptt) - 討論白板:[第二週討論區](https://whimsical.com/7VCBqfKufrhnrQ75rkgzWY) - :::spoiler **組員參與名單** | 組員 | | -------- | | Joy Cheng | | Aaron Tu | | Alvin | | Sam | | Debbie | | Kin Hei Shing | | Yumi | ::: - [討論紀錄](#線上討論截圖) ::: ## 問題 ### 第一題 繪製與討論剪刀石頭布的邏輯 使用 [whimsical](https://whimsical.com/) 工具繪製剪刀石頭布的邏輯,回報時,請提供 whimsical 公開連結給助教檢視。助教會觀察您的邏輯是否都有滿足各種條件。 例如: * 玩家 A 出剪刀:玩家 B 出石頭 = A 玩家輸 * 玩家 A 出剪刀:玩家 B 出布 = A 玩家贏 * 玩家 A 出剪刀:玩家 B 出剪刀 = 平手 * 玩家 A 出布:玩家 B 出布 = 平手 > 答:[**流程圖連結**](https://whimsical.com/7VCBqfKufrhnrQ75rkgzWY) ## 主線任務討論區 | Name | Codepen網址 | | ------ | ------- | | Joy Cheng | [codepen](https://codepen.io/joycheng5432/pen/gOxaZog) | | Aaron Tu | [codepen](https://codepen.io/aarontu/pen/LYjpYyg) | | Han | [codepen](https://codepen.io/PeiHan/pen/PoKPzXZ) | | Alvin | [codepen](https://codepen.io/Alvin20201116/pen/yLoOVLq) | | Sam | [codepen](https://codepen.io/sam-hsu/pen/xxLZbjo) | ## 線上討論截圖 版本一程式碼 ```jsx let scissors = "剪刀"; let stone = "石頭"; let paper = "布"; let playerA = scissors; let playerB = scissors; if (playerA === playerB) { console.log("平手"); } else { if (playerA == scissors && playerB == paper) { console.log("Player A 獲勝"); } else if (playerA == scissors && playerB == stone) { console.log("Player B 獲勝"); } else if (playerA == stone && playerB == scissors) { console.log("Player A 獲勝"); } else if (playerA == stone && playerB == paper) { console.log("Player B 獲勝"); } else if (playerA == paper && playerB == stone) { console.log("Player A 獲勝"); } else if (playerA == paper && playerB == scissors) { console.log("Player B 獲勝"); } } ``` 版本一第2種寫法程式碼 ```jsx let playerA="布"; let playerB="剪刀"; if(playerA===playerB){ console.log("平手"); } else if(playerA==="剪刀"&&playerB==="布" ||playerA==="石頭"&&playerB==="剪刀"||playerA==="布"&&playerB==="石頭"){ console.log("playerA玩家贏了"); } else if(playerB==="剪刀"&&playerA==="布" ||playerB==="石頭"&&playerA==="剪刀"||playerB==="布"&&playerA==="石頭"){ console.log("playerB玩家贏了"); } ``` 版本二程式碼 ```jsx let playerA="布"; let playerB="剪刀"; if(playerA==="剪刀"){ if(playerB==="剪刀"){ console.log("平手"); }else if(playerB==="石頭"){ console.log("playerB贏了"); }else{ console.log("playerA贏了"); } }else if(playerA==="石頭"){ if(playerB==="石頭"){ console.log("平手"); }else if(playerB="剪刀"){ console.log("playerA贏了"); }else{ console.log("playerB贏了"); } }else if(playerA==="布"){ if(playerB==="布"){ console.log("平手"); }else if(playerB==="剪刀"){ console.log("playerB贏了"); }else{ console.log("playerA贏了"); } } ``` ![](https://i.imgur.com/nzfGAgA.jpg) </br> ![](https://i.imgur.com/4TMbcl9.png) </br> ![](https://i.imgur.com/Rhzyw0R.png) ## 線上其他討論 | Title | Link | |--|--| |JavaScript 30|https://javascript30.com/| |JavaScript 30 github|https://github.com/wesbos/JavaScript30| |JavaScript 題目篇 - 新手 JS 地下城|https://www.udemy.com/course/js-underground/ | |切版技術再升級!一課覆蓋 TailwindCSS + Vue3|打造後台管理頁面 UI|https://hiskio.com/fundraising/620/about| |Tailwind CSS|https://tailwindcss.com/| |六角學院 Tailwind|https://youtu.be/k781fEhqzxI| |六角前端大補帖|https://coggle.it/diagram/XJdj8UA5tjeIugda/t/%E5%85%AD%E8%A7%92%E5%89%8D%E7%AB%AF%E5%A4%A7%E8%A3%9C%E5%B8%96| |成為網頁前端(frontend)工程師學習地圖|https://softnshare.com/frontend-developer/| |Awesome GitHub Profile README|https://github.com/abhisheknaiidu/awesome-github-profile-readme| |Codewars|https://www.codewars.com/| ## 前端地圖 ![](https://i.imgur.com/UTnUEZA.jpg)