--- ###### tags: `公益程式體驗營 - 2022` `JavaScript` `程式筆記` --- # 每日 JS 任務筆記 開篇小試一下,請問`a`是...? ```javascript= var a = 0; if(a = 1){ a = 2; }; ``` :::spoiler 解答 是 2 喔,因為一個 `=` 是賦值不是判斷 出自[卡斯伯 DC](https://discord.com/channels/801807326054055996/801807326054056003/977753618528747580) ::: ## 無法控制輸入的個數?用 argument object 吧 [題目三:函式強制正整數相乘](/495ohZnOSGOPUq33qPNynw#%E9%A1%8C%E7%9B%AE%E4%B8%89%EF%BC%9A%E5%87%BD%E5%BC%8F%E5%BC%B7%E5%88%B6%E6%AD%A3%E6%95%B4%E6%95%B8%E7%9B%B8%E4%B9%98) ```javascript= // input 輸入 multiply(2,3) multiply(1,3,5) multiply(7,7,7,7,7) multiply(5,3,-2) multiply(4) // output 輸出 6 15 16807 30 4 ``` > If a function is called with too many arguments (more than declared), these arguments can be reached using the arguments object. > [JavaScript Function Parameters](https://www.w3schools.com/js/js_function_parameters.asp) 應用技術: 1. [argument object](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Functions/arguments#rest_default_and_destructured_parameters) 1. [JavaScript Math.abs()](https://www.w3schools.com/jsref/jsref_abs.asp) ```javascript= function multiply(...num) { let output = 1; for (let i = 0; i < num.length; i++) { output *= Math.abs(num[i]); } return output; } ``` ## 正規表達式 * 完全不懂先看:[初探Regex 正規表達式](https://moojing.medium.com/javascript-%E5%88%9D%E6%8E%A2regex-%E6%AD%A3%E8%A6%8F%E8%A1%A8%E9%81%94%E5%BC%8F-1da2f4d94795) * 有懂一點再看:[十五分鐘認識正規表達式,解決所有文字難題](https://5xruby.tw/posts/15min-regular-expression) * 文件看這:[MDN 正規表達式](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Regular_Expressions) * 逐步拆解看這:[regex101](https://regex101.com/) ### 規定長度用`.length()`?,你也可以用`$` `$`表示以...結尾,後面什麼都不加,表示結尾不能有東西,如果前面要求驗證6碼,以`$`結尾表示長度最多6碼 #### [題目二:訂單編號](https://hackmd.io/yquxbk02R0idPjjR8V0mPA#%E9%A1%8C%E7%9B%AE%E4%BA%8C%EF%BC%9A%E8%A8%82%E5%96%AE%E7%B7%A8%E8%99%9F) 超瞎書局的訂單編號規則 * 只有 6 碼 * 開頭必須是 B 開頭 ```javascript= function checkFiveWord(str) { const regex = /[B][0-9]{5}$/; return regex.test(str); } ``` 也可以 ```javascript= /^B[0-9]{5}$/ ``` #### [題目三:驗證密碼](https://hackmd.io/yquxbk02R0idPjjR8V0mPA#%E9%A1%8C%E7%9B%AE%E4%B8%89%EF%BC%9A%E9%A9%97%E8%AD%89%E5%AF%86%E7%A2%BC) 來兒美超商的電商密碼規則如下: 1. 至少一個大寫英文 2. 至少一個小寫英文 3. 至少一個數字 4. 至少 8 碼以上 ```javascript= function checkPassword(str) { const regex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,}$/; return regex.test(str); } ``` ![regex](https://i.imgur.com/alEm98Z.png) 斷言參考[五倍紅寶石解釋](https://5xruby.tw/posts/15min-regular-expression#:~:text=//%20Positive%20Lookahead%EF%BC%9A%20A(%3F%3DB)%20%E2%86%92%20A%20%E5%BE%8C%E6%96%B9%E7%9A%84%E6%A2%9D%E4%BB%B6%E8%A6%81%E7%AC%A6%E5%90%88%20B) ## 物件用`return`不會給你內容 [題目二:反轉陣列](https://hackmd.io/j3FKi94yR6SY2SA4XgC1Hg#%E9%A1%8C%E7%9B%AE%E4%BA%8C%EF%BC%9A%E5%8F%8D%E8%BD%89%E9%99%A3%E5%88%97) ```javascript= function reverseAry(arr) { console.log(arr.reverse()); } console.log(`題目二:反轉陣列`); reverseAry([7, 8, 9]); reverseAry(["black", "white", "red"]); reverseAry([{ name: "mike" }, { name: "John" }]); ``` ## return 裡面有return [題目四:進階題,不適合新手](https://hackmd.io/6B9q4eChSO6xM6WTcxZGyA#%E9%A1%8C%E7%9B%AE%E5%9B%9B%EF%BC%9A%E9%80%B2%E9%9A%8E%E9%A1%8C%EF%BC%8C%E4%B8%8D%E9%81%A9%E5%90%88%E6%96%B0%E6%89%8B) 請宣告一個 `obj` 函式,並用`obj()[2]()`方式執行,並會 return 回傳 "hi" ```javascript= function obj() { return { 2: function () { return "hi"; }, }; } ``` 基本上跟5/19練習[題目一](https://hackmd.io/aeZbS-lKR5W66zfKtOqiug#%E9%A1%8C%E7%9B%AE%E4%B8%80%EF%BC%9A-%E5%87%BD%E5%BC%8F-return-%E7%89%A9%E4%BB%B6)概念相同 ```javascript= function a() { return { hi: "hi", sayYo: "yo~", cry: "嗚嗚", }; } ``` ## 小試身手:JS ES6 test :::spoiler 測試結果 ![JS ES6 test](https://i.imgur.com/QAIBGiO.jpg) ![JS ES6 test](https://i.imgur.com/iaTlX3a.jpg) ![JS ES6 test](https://i.imgur.com/mIII63M.jpg) ::: ## Sort an array of number [題目三:陣列排序](https://hackmd.io/l61mQS_PRo26SwFgYt9LwA#%E9%A1%8C%E7%9B%AE%E4%B8%89%EF%BC%9A%E9%99%A3%E5%88%97%E6%8E%92%E5%BA%8F) `.sort()` 是按照 string 每一字元的 unicode 做排序,如果是數字會先轉成字串再一一比較 ```javascript= var scores = [1, 10, 21, 2]; // 注意 10 會排在 2 前面 // 因為字串 '10' 的第一個字元 '1' 比 '2' 的 Unicode code point 小 scores.sort(); // 返回 [1, 10, 2, 21] ``` [數字的排序](https://stackoverflow.com/questions/1063007/how-to-sort-an-array-of-integers-correctly) ```javascript= function sortAry(act, arr){ if(act === "從小到大"){ return arr.sort(function(a, b) { return a - b; }); }else { return arr.sort(function(a, b) { return b - a; }); } } ```