--- tags: React 直播班 - 2024 冬季班 --- # 🏅 Day 9 - 表達式觀念、Bootstrap 格線系統 3 請同學先閱讀完 「[JavaScript 表達式觀念及運用 - JS Expression](https://wcc723.github.io/development/2020/09/17/js-expression/)」 這篇文章後再作答。 題目 --- #### 問題一(判斷何者為表達式): ```js= if(Ans) { console.log("Ans 是表達式"); } ``` 請問以下有哪些選項代入 Ans 可以輸出 console.log 不會報錯? 補充: [真值假值觀念](https://developer.mozilla.org/zh-CN/docs/Glossary/Truthy) ``` 1. 2 === 2 2. "string" 3. var a 4. if(true){let a = 2;} 5. [25, 30] // 純陣列 6. {name: "hexSchool"} // 純物件 ``` #### 問題二(表達式的應用): ```js= function hexIsGood() { return true; } ``` 以上程式碼為一個「表達式」,請大家到 [MDN](https://developer.mozilla.org/en-US/) 或是透過 Google 搜尋,尋找有哪些程式運作可以插入以上的表達式,仍能正確運行。 舉例(if 判斷式): ```js= function hexIsGood() { return true; } if(hexIsGood()) {console.log("此程式碼可以運作")}; ``` Bootstrap 格線系統 - 常見錯誤 --- 在運用格線系統 `.row` 時,外層需使用 `.container` 、 `.container-*`,避免產生 x 軸 請將此 [CodePen](https://codepen.io/yen-kg/pen/WNVMYbr) 補上 `.container-*`,並觀察其差異 ## 回報流程 將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 解答位置請參考下圖(需打開程式碼的部分觀看) ![](https://i.imgur.com/vftL5i0.png) <!-- 解答一 1, 2, 5, 6 因為它們都是表達式,會回傳結果。 --> <!-- 解答二 // Ex1: 可以帶入三元運算子 function hexIsGood() { return true; } console.log(hexIsGood() ? '很棒棒' : '不棒棒'); // Ex2: 可以代入樣板字面值 function hexIsGood() { return true; } let str = `六角學院很讚: ${ hexIsGood() }`; console.log(str); --> <!-- - Bootstrap - 將 ... 改為 .container、.container-fluid、.container-sm .. 都可以 --> 回報區 --- | Discord | CodePen / 答案 | |:----------------:|:-------------------------------------------------------------------:| | Sonia | [CodePen](https://codepen.io/YUJOU/pen/KwPqewE?editors=1010) | | Toung | [CodePen](https://codepen.io/Toung/pen/vEBZwMa) | | 4chan | [CodePen](https://codepen.io/ijuolaqc-the-looper/pen/zxOzVvz) | | tim | [CodePen](https://codepen.io/jskrtivy-the-animator/pen/PwYjrqg?editors=1010) | |Hailey|[CodePen](https://codepen.io/sxbokfja-the-flexboxer/pen/XJrgLmR?editors=1111)| | Satar | [CodePen](https://codepen.io/SatarKuo/pen/ByBZgBe?editors=1011) | | 毛巾 | [CodePen](https://codepen.io/bqdcjboa-the-solid/pen/vEBZqyv) | | Nocab | [CodePen](https://codepen.io/PeihanWang/pen/XJrgLja?editors=1011) | | Jasmine Lin | [CodePen](https://codepen.io/Jasmine-Lin-the-vuer/pen/KwPqjZN) | | Tatsu | [CodePen](https://codepen.io/chindesu0207/pen/dPbRBzQ) | | 泊岸 | [CodePen](https://codepen.io/qoq77416416/pen/KwPqjGm?editors=1011) | | Yen | [CodePen](https://codepen.io/yuxxxlouyen/pen/PwYjrBw) | |ollie|[CodePen](https://codepen.io/daiyy97/pen/OPLgKrx?editors=1001)| | Clove_墨 | [CodePen](https://codesandbox.io/p/sandbox/fmdr4v) | | 爆漿 | [CodePen](https://codepen.io/nvdwwlbx-the-vuer/pen/QwLMLGY) | | Noy(Toad) |[CodePen](https://codepen.io/MochiCodingPen/pen/WbeOVEX) | | Kaya |[CodePen](https://codepen.io/kayaribi/pen/emOEYPy) | | Tammy | [CodePen](https://codepen.io/Tammy_Tsai/pen/xbKLbOB) | | Rothy | [CodePen](https://codepen.io/ChloeHsu1/pen/zxOdxjX) | | Rogan | [CodePen](https://codepen.io/RoganHsu/pen/GgKvgYW?editors=1010) | | andy | [CodePen](https://codepen.io/andygggg/pen/mybMJpx) | | yuyeh_1212 | [CodePen](https://codepen.io/yuyeh1212/pen/KwPvpQj) | | ya_meow | [Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/VYZWJWV?editors=1111)| | Amanda | [CodePen](https://codepen.io/cym199922/pen/bNbrwxY) | | 蘑菇星星 | [CodePen](https://codepen.io/brrrieon-the-vuer/pen/dPbzOZR?editors=1011) | | LinaChen | [CodePen](https://codepen.io/LinaChen/pen/MYgvpoX) | | Aaron 謝宗佑 | [CodePen](https://codepen.io/aaron-hsieh/pen/azoweqg) | | Fabio20 | [CodePen](https://codepen.io/fabio7621/pen/emOEVxJ?editors=1111) | | Rochel | [Codepen](https://codepen.io/rochelwang1205/pen/yyBoKbJ?editors=1010)| | 阿佑 | [CodePen](https://codepen.io/ans9323052/pen/emOEMBg) | |a1phaki(小k)|[codepen](https://codepen.io/a1phaki/pen/raBzZVd)| | mercury2508. | [CodePen](https://codepen.io/Mercury2508/pen/azoyjKq) | | Johnson | [CodePen](https://codepen.io/crpbugqy-the-typescripter/pen/ogveRPW) | | 嚼勁先生 | [CodePen](https://codepen.io/James520284/pen/XJraveP) | |邵|[CodePen](https://codepen.io/ukscrlno-the-typescripter/pen/NPKgZQd)| | 蕾蕾 leilei | [CodePen](https://codepen.io/Leileisme/pen/pvzWNJO?editors=1011) | | Jun | [CodePen](https://codepen.io/jun12079/pen/xbKXeQM) | |Glen69515|[Codepen](https://codepen.io/glenyaochih/pen/ZYzXgZR?editors=1111)| |Mike|[Codepen](https://codepen.io/mike2049/pen/NPKYzNq?editors=1011)| | Joannehu | [CodePen](https://codepen.io/nelbabkv-the-flexboxer/pen/xbKJboO?editors=1011) | | yun-lin | [CodePen](https://codepen.io/yunlinhsu/pen/xbKQGpb?editors=1112) | | Cami | [CodePen](https://codepen.io/irisLife/pen/jENYWQy) | | yaoling.liang | [CodePen](https://codepen.io/Yao-Ling-L-/pen/ZYEWyqM) | | Jim | [CodePen](https://codepen.io/JimChou/pen/wBvGjzp?editors=1011) | | KOMATSU PEI | [CodePen](https://codepen.io/Komatsu2021/pen/emYWxEM?editors=1011) | | 姜承 | [CodePen](https://codepen.io/Troy0718/pen/LEYrRpO?editors=1012) | | chris | [CodePen](https://codepen.io/chris-chen-the-selector/pen/XJWyQJy) | | Chuang | [CodePen](https://codepen.io/uidoytjq-the-solid/pen/bNGyzrB?editors=1011) | | jinliu214 | [CodePen](https://codepen.io/jinliu214/pen/emmMdMq?editors=0010) | <!-- 快速複製 | user | [CodePen]() | -->