第二週程式基礎(上) JavaScript 筆記

# 第二週程式基礎(上) JavaScript 筆記 ## What 以前 JS 只能在瀏覽器執行，幫瀏覽器做基本運算。 node.js 是一個運行環境、執行環境（runtime），可以讓 JS 在瀏覽器外面跑，例如：你的電腦 JS 有基本共用的功能，例如 var/ if 等等，但不同 runtime 會提供不同的功能給 JS 。 document 只有瀏覽器有提供。console.log 兩邊都有提供，node.js 會在終端機 terminal 顯示。在網頁裡，`f12`可以顯示 console.log ## 快速簡介 if/ else if/ else [ ] == array for (初始條件; 終止條件; 每圈要做的事情) {} 注意： return 代表在 function 裡面遇到要全部暫停並回傳的東西一定要 console.log 才會輸出印出東西但是 codewar 不看輸出 (console.log) 的值，只看回傳 (return) 的值 return 是玩遊戲按按鈕的概念，console.log 比較像是大喊：我完成了！注意新的 online judge system 是看什麼 ## JS101 ### Syntax | Syntax | function | | | --------------------------------------- | ------------------------------ | ---- | | `node <file name>` `Ctrl + C` 退出 | 把 file 用 node 的執行環境打開 | | | + - * / a%b == a 除 b 餘多少 | 查看目前 commit 的狀態 | | | `console.log()` | print 出我要的東西 | | | && \|\| ! | and or not | | | | | | | | | | | | | | | | | | | | | | ### 基本運算( math 和遞增、遞減) | 語法 | 用途 | 用例 | 注意點 | | :--: | :----: | :---------- | :-------------------------------------------------------- | | + | 加號 | 1 + 2 // 3 | 前後空格 | | - | 減號 | 3 - 2 // 1 | 前後空格 | | * | 乘號 | 2 * 3 // 6 | 前後空格 | | / | 除號 | 4 / 2 // 2 | 前後空格 | | % | 取餘數 | 10 % 3 // 1 | 前後空格 | | ++ | 遞增 | i++ | eslint 不接受 i++ 會先跑完整句才加， ++i 會先加完再整句 | | – | 遞減 | i++ | eslint 不接受 i-- 會先跑完整句才減， --i 會先減完再跑整句 | | | 指數 | 2 ** 3 // 8 | | ### 邏輯運算 #### 短路性質 - && 與 || | and | result | | or | result | | | ---------- | ------ | ---- | ------------ | ------ | ---- | | **T** && T | T | | **T** \|\| T | T | | | T && **F** | F | | **T**\|\| F | T | | | **F** && T | F | | F \|\| **T** | T | | | **F** && F | F | | **F** \|\| F | F | | print 出決定的人，粗體代表是決定的關鍵 ( 注意：0 = F，其他大部分都是 T ) ex 10 && 3 == 3，F && 3 == F，0 && 3 == 0 3 || 30 == 3，F || 100 == 100，0 || 100 == 0 短路的性質在這裡的意思就是不會跑後面，在前面就短路了。 ### 位元運算 *** #### 位移運算 `<<` 和 `>>` 在二進位的世界裡，往左一位代表整個乘 2，同理往右代表除 2 EX：`10 << 1 == 20`　，因為 10 用二進位表示是 1010 ，整個往左一位變成 10100，換回十進位就是 20 若不能整除呢？他會無條件捨去 EX：`15 >> 1 == 7` #### 位元運算一個符號 => 位元運算，對每個位數做邏輯運算兩個符號 => 邏輯運算 EX：`15 & 10 == 15`，`15 && 10 == 10` | 語法 | 用途 | 輸入 | 輸出 | 二進位 | | :--: | :--: | :------: | :--: | :-------------------: | | & | and | 10&15 | 10 | 1010 & 1111 == 1010 | | pipe | or | 10 or 15 | 15 | 1010 & 1111== 1111 | | ^ | xor | 2 ^ 4 | 6 | 1010 & 1111 == 0101 | | ! | not | !15 | -16 | …00001111 …1111110000 | ### 變數 `var = 123`// 把 123 的值給 box 這個變數，也就是賦值 - 命名規範：大小有區別，不能用數字開頭，不能取名為 var。 - 命名方式： - 用底線區分（ex: blood_times_four） - 用大小寫區分 - 駝峰式（ex: BloodTimesFour），重點是要統一 undefined：有宣告，沒賦值 not defined：沒宣告 `++` & `--` `a + 1 == a++` `a++`和`++a`的差別先執行程式判斷，再加一。先加再判斷 `var a = 0;` `console.log (a++ && 30 )` #### 變數型態在 JS 不用一開始先指定型態，後面也可以變來變去 `type of "example"` 看 example 是什麼型態 - Primitive - number //42 - string //“42”, ‘42’ - boolean // true, false - object - array - object - null - 歷史悠久的 bug // typeof null === 'object' - function - undefined box[0] 索引值 index ！在 JS 的 index 從 0 開始 ##### Array 用來存性質相近的東西 | Syntax | function | | :-----: | :------------------------ | | .length | 陣列長度 | | .push | 把 value 放到陣列最後一項 | 用中括號，用逗點隔開，可放初始值 ##### Object 用大括號 `var peter = {` name: 'peter', score: 100, address: 'taipei city' }` object & array 合併使用 student.push(peter) cosole.log(students[0]) 拿東西 (加 . ) console.log(students[0].score) or console.log(peter.score) or console.log(perter['name']) // 才可以放變數，所以通常中括號裡面會放變數物件裡可以放任何東西，物件裡可以放陣列、也可以放物件。 #### 注意！ - 運算時型態要注意數字 + 字串 == 字串 // `10 + '20' == 1020` 怎麼辦？可以事先轉成數字 // var a = '20' ; number(a) = 20 用新的 function `parseInt` // var a = '20' ; parseInt(a, 10) = 20 ，這裡的 10 代表十進位 - 浮點數誤差你看到的 0.3 在電腦裡沒辦法存的那麼精準，可能是 0.30000005 所以可以的話盡量不要用小數 ### 到底等於還是不等於 | 符號 | 說明 | | | :---: | :------------------------------------ | -------------------------------------------- | | `=` | 賦值 | `var a = 10` // 把 10 放入 a 這個變數 | | `==` | 判斷相等（一般的等於） | == "0" // true 0 == null // false | | `===` | 判斷相等，還判斷型態（更嚴格的等於） | 0 === "0" // false | | `!=` | 允許 implicit coercion 的不等性檢查 | | | `!==` | 不允許 implicit coercion 的相等性檢查 | | ```a = 10 console.log (a=1)``` 執行順序右到左 `a = 10 == 10`輸出 `true` `==` 要注意，可能型態不一樣會有 bug ，所以建議都用 `===`，比較不會出錯 ### 沒有如果 `if/ else` `if/ else if/ else ` `if (70 >= score >= 60)`// 跟想像不同，會由左看到右所以如果有兩個以上的條件要用 `&&` > false 就只有幾個 0, null, 空字串 if 的條件`(number % 5 ===0)`也可以寫成`(!(number % 5))` 代表直接用 1 和 0 來判斷第二種雖然程式碼比較少，可是可讀性比較低，不太能一眼辨識 > ！寫程式縮排好習慣，一個 block 就要縮排，才能方便一眼辨識 ### Switch case `switch(要判斷的東西){要怎麼判斷}` 使用時機：當有三四個條件要判斷的時候，其實沒那麼多注意：每個 case 最後記得要 break ![image-20200619160110749](https://i1.wp.com/lailalaii.files.wordpress.com/2020/07/image-20200619155950559.png?ssl=1) 兩個條件一樣的判斷可以一起寫也可以寫一個 array 對應到中文的月份，這種對應式的題目，推薦用這個最簡潔 ![image-20200619160406844](https://i1.wp.com/lailalaii.files.wordpress.com/2020/07/image-20200619160406844.png?ssl=1) 小知識 ![image-20200619161415755](https://i2.wp.com/lailalaii.files.wordpress.com/2020/07/image-20200619161415755.png?ssl=1) 可以簡化成 ![image-20200619161451132](https://i2.wp.com/lailalaii.files.wordpress.com/2020/07/image-20200619161451132.png?ssl=1) ### 三元運算子 ternary `<條件> ? <true-顯示>: <false-顯示>` 原本![image-20200619161620962](https://i0.wp.com/lailalaii.files.wordpress.com/2020/07/image-20200619161620962.png?ssl=1)後來![image-20200619161931213](https://i2.wp.com/lailalaii.files.wordpress.com/2020/07/image-20200619161451132.png?ssl=1) 也可以巢狀，三元裡面還有一個三元，可是不好讀，直接用 if else 即可 - 練習一：判斷是否及格請你自己寫出一段程式碼，是判斷一個叫做 score 的變數是否及格（超過或剛好 60 分），如果及格的話就輸出 pass，否則輸出 fail。進階練習：除了判斷是否及格以外，也請你對滿分做出特別判斷，如果是 100 分的話就輸出 you are no1! ```js var score = 100 var message = score >= 60 ? (score == 100 ? 'you are no1!':'pass') : 'fail' console.log(message) ``` - 練習二：BMI 計算 > BMI 值的計算公式為：體重 / 身高^2。 > > 假設體重是 70，身高是 180(1.8m)，BMI 就是 70/(1.8*1.8) = 21。 > > 現在請你寫出一個簡單的 BMI 計算器，用兩個變數代表體重跟身高，算出 BMI 之後判斷 BMI 是落在哪個範圍內並輸出相對應的字串。 > > 體重過輕：BMI < 18.5 > > 正常範圍：18.5 <= BMI < 24 > > 過重：24 <= BMI < 27 > > 輕度肥胖：27 <= BMI < 30 > > 中度肥胖：30 <= BMI < 35 > > 重度肥胖：35 <= BMI Method 1: for function ```js var BMI; var weight = 70; var height = 1.8; BMI = weight / (height ^2) if (BMI <= 18.5 ){ console.log('體重過輕') } else { console.log('正常範圍')} ``` Method 2: ### 迴圈小括號放條件，大括號是一個 block #### Syntax - do while 迴圈 ``` do{ 迴圈要做的事情 } while (終止條件) ``` - while 迴圈 ``` while (終止條件){ 迴圈要做的事情 } ``` - for 迴圈 ```js for(初始值;終止條件; i 每圈結束要做的事情){ 迴圈要做的事情 } ``` What：重複做一樣的事情，通常都有一個終止條件，"無窮迴圈" 就會跳不出來，通常是終止條件設錯了（！`label` `goto` JS 沒有） #### 在瀏覽器上面逐行檢查 1. 在 .html 的 code 裡面加上 'debugger' 2. 按 `f12` 顯示 console 3. 按 `f9` 逐行檢查，也可以用滑鼠回去看變數現在是什麼。也可以在右邊的 watch 打上有興趣追蹤的變數點一下左邊的行數，就可以設置中斷點， run 之後它就會跑到這暫停，也可以設多個中斷點 #### do while 迴圈如何阻止無窮迴圈？ 1. 在 while 放跳出的判斷條件 2. 在 do 裡面放一個 if 範例 ```js do { console.log(i) i++ } while (true) ``` 解法一 ```js var i=0; do { console.log(i) i++; } while (i <= 10) ``` 解法二 ```js var i=0; do { console.log(i) i++; if (i>10){ break } } while (true) ``` #### while 迴圈 ``` while (終止條件){ 迴圈要做的事情 } ``` - do…while 和 while 差別在於 - while 先檢查再做。 - do…while 先做再檢查。若不小心寫成無窮迴圈，`Ctrl + C`可以終止 #### for 迴圈一個迴圈包含：一開始的初始值，終止條件，變數 i 每圈結束要做的事情 Syntax： ```js for(初始值;終止條件; i 每圈結束要做的事情){ 迴圈要做的事情 } ``` 初始值可以不寫通常用在已經知道跑多少圈的時候 - 範例 `continue` 和 `break`的差別 `continue` ：跑到迴圈下一圈 ```js for (i=1 ; i <= 5 ; i++){ if(i===3) continue console.log(i) } // output == 1245 ``` `break` ：直接跳出迴圈 ```js for (i=1 ; i <= 5 ; i++){ if(i===3) break console.log(i) } // output == 12 ``` 與陣列搭配 ```js var score=[2,5,7,10,11]; for (var i=0 ; i <= 5 ; i++){ console.log(score[i]); } ``` ## 綜合題目練習Lv1 ### 練習一：印出一到九 ```js /* for (var i=1;i<10;i++){ console.log(i); } */ var i=1; while(i<10){ console.log(i); i++; } ``` ## 函式 function y = f(x) // y = 回傳值，x = 參數 - 可以藉由名稱來 call function - call function 時要包含`()` - 例： `console.log(functionName())`，否則會印出他是一個 function - 函式參數命名時盡量用有語意的字當參數增加可讀性 - 需要時可用 return 來回傳值 - 可以傳任何東西，包含物件 - 注意 return 後面不可以空白，不然會是 undefine，且把後面的當成兩句。所以就算是一大串還是要至少有一個前括號在同一行 ```js function generateArray(n){ var array = [] for ( var i=1 ; i<=n ; i++){ array.push(i) } return array } console.log(generateArray(5)) ``` ### 宣告 ```js //方法1 function hello() { console.log('hello') } //方法2 var hello = function(){ console.log('hello') } //方法3 ES6 const hello=() => { } ``` ### 函式中的函式 function 的參數也可以是一個 function， return 也可以回傳一個 function ```js function transform(arr, transformFunction){ var result = [] for (var i=0; i<arr.length; i++){ result.push(transformFunction(arr[i])) // 函式 transform 由兩個參數組成，分別是 arr, transformFunction // 透過 for 迴圈把 arr的每個元素數字經過 transformFunction之後都丟進 result 這個 array 裡 } return result // 回傳 result } function double(x){ return x*2 } console.log( transform([1,4,6], double) //[1,4,6] & double 是 transform 的引數 ) // 也就是把 transformFunction 當成一個可變的 function，能動性比較高 // 再另外寫一個 function 來定義要哪一種 transform ``` ### anonymous function 匿名函數也可以把回傳的 function 直接寫進 console 裡面，變成一個 anonymous function 例： ```js function transform(arr,transformFunction){ let result = [] for(var i = 0; i < arr.length; i += 1){ result .push(transformFunction(arr[i])) } return result } console.log( transform([1, 2, 3], function(x){ return x * 2 }) ) ``` ### Parameter （參數）和 argument （引數）參數：本身 function 定義的東西引數：放進 function 參數裡的數值，也可以是另一個 function ![img](https://i.imgur.com/YwFCJZm.png) [參考資料](https://ithelp.ithome.com.tw/articles/10204008) - ### arguments JS 裡面有內建 arguments，可以把引數 print 出來 ```js function add(a,b){ console.log(arguments) return a+b } console.log(add(2,5)) // [Arguments] { '0': 2, '1': 5 } // 7 ``` argument 是一個物件，而不是陣列。 **`arguments`** 物件是一個對應傳入函式之引數的類陣列（`Array`-like）物件。//白話文運動：很像陣列的物件 ### function 傳參數機制 - 裡面改外面？ function 本身的運作機制比較像是複製一份過去，所以不會改到原本的，尤其是三種基本類別：數字、字串、布林但是像是物件、陣列的話，裡面就可以改外面的，因為指向同一個東西用等號去指向新的東西的話，就不會改到另外一個 - 用 dot notation 的時候會改到外面的 ![img](https://i.imgur.com/fGWhtuV.png) 上面這種方式就叫做：`call by value`（或是 `pass by value`），在呼叫` function` 的時候把「值」給複製一份 > 宣告一個 object 的時候，在底層實作上，其實這個 object 存的是一個記憶體位置 ### return - 不需要知道結果的 - 不需要寫 return - call function 時電腦不會得到回傳值 - 這時 return value 的預設就是 undefine - 會需要知道結果的 - 需要 return - 注意，在 function 中，電腦一遇到 return 就會立刻回傳，然後跳出function，所以在 return 後面的程式碼就不會被執行。 - 若 function 裡面沒有 console (也就是 call 的功能)，那麼即使放入引數 `node index.js` 也不會有反應，不然就是在外面 console.log 也行 ## 內建函式 ### Number 類型 #### `Number()`：字串轉數字 #### `parseInt(變數, 進位制)`：字串轉整數，小數會直接省略 #### `parseFloat(變數)`：字串轉浮點數 #### `.toString()`：數字轉字串 `a + ''` 也有相同效果 #### `Number.MAX_VALUE` 得知可儲存的最大值，超過的話數字會變得不精準 #### `Math.PHI`：~ 3.14 ，常數通常用大寫 #### `Math.ceil()`：無條件進位 `Math.ceil(10.9)` = 11 #### `Math.floor()`：無條件捨去 `Math.floor(10.9)` = 10 #### `Math.round()`：四捨五入 `Math.round(10.9)` = 11 #### `Math.sqrt()`：開根號 `Math.sqrt(9)` = 3 #### `Math.pow()`：次方 `Math.pow(2.10)` 等於 2的 10次方 === 1024 #### `Math.random()` 0 <= random < 1的隨機數，可以產生 1~10 的隨機數字 `console.log(Math.floor(Math.random()*10)+1)` // 乘十倍、加一、取締版 ### [String 類型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) #### `<str>.length` 數字串有幾個字，空格也算 #### `<str>.toUpperCase()`：轉大寫 //注意，括號不能省 #### `<str>.toLowerCase()`：轉小寫 #### `<str>.charCodeAt()`：字母轉數字得到某個字母的 ASCII code 代號，大小寫的代號差 32 例如想知道 `a = 'dkf'` 中 f 的 ASCII code，就用 `a.charCodeAt(2)`// 2 代表第 3 個字母判斷是不是小寫？　檢查有沒有在中間就好，因為照順序排，同理判斷是不是大寫或是是不是字母 ```js var char = 'k' console.log( char >= 'a' && char <= 'z') ``` #### `String.fromCharCode(數字)`：數字轉字母查詢 ASCII code 代表的字串 #### `<str>.indexOf('詞')` 查詢詞在字串中的位置，數字代表這個詞在第幾個位置。若回傳值小於零，代表詞不存在字串內 #### `.replace('被替換', '替換')` 取代字串中的某一個詞，只會找位置最前面的替換，其他的不會變。例如 `'hey hello'.replace('h', '!!!')`，只會變成 `!!!ey hello` 如果有不只一個 h ，只會換第一個 // 如果要一次換多個，可以用正規表達式 regex ，以後會提， g 代表 global #### `<str>.split()`：切割字串 `.split(' ')` 以空格分、`.split(',')` 以逗號分、`.split("")`切字母`.split()`不切 #### `<str>.strim()`：消除前後空格 ### [Array 類型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) 注意：`join()` 回傳的結果是字串，`filter()`回傳的結果是 array #### `.join()` 在陣列中插入某元素，**變成字串**。`[1, 2, 4].join('!')` 結果是 `1!2!3` #### `.map(變數)` ：將變數帶入陣列中每個元素，而且可以多次操作。 ```js var arr = [1, 2, 4] console.log( arr .map(function (x) { return x*-1 }) .map(function (x) { return x*2 }) ) ``` #### `.filter()` 過濾，true 會留下、false 會不見 ``` var arr = [1, 2, 4] console.log( arr .map(function (x) { return x*-1 }) .filter(function (x) { return x > 0 //正數會留下，負數被過濾掉 }) ) ``` #### `.slice()` 切陣列，回傳新的陣列，**不會改動**到原有陣列。以陣列 a = [1, 2, 3, 4, 5] 為例： - `a.slice(2)` = [3, 4, 5] - `a.slice(2, 3)` = [3] - `a.slice(2, 4)` = [3, 4] #### `.splice()` 切陣列，**會改動**原陣列。以陣列 a = [1, 2, 3, 4, 5] 為例： - `a.splice(1, 0, '100')` = [1, 100, 2, 3, 4, 5]，在 a[1] 位置，刪除 0 個元素，插入 ‘100’，插入的感覺 - `a.splice(4, 1, '100')` = [1, 2, 3, 4, 100]，在 a[4] 位置，刪除 1 個元素，插入 ‘100’，取代的感覺 #### `.sort()` 排序，預設值依照「字母順序」排列 - 陣列是 months = [‘March’, ‘Jan’, ‘Feb’]，`months.sort()` = [‘Feb’, ‘Jan’, ‘March’] //照字母順序排 - 陣列是 num = [1, 30, 4, 21]，`num.sort()` = [1, 21, 30, 4] //當字串，只看第一個數字若要依照數字順序排列陣列元素，可以用此方式 ```js var arr = [1, 30, 4, 21] //要由小排到大 arr.sort(function(a, b){ //想像成 a 是排在前面的數字、b 是排在後面的數字 if (a===b) return 0 if (b > a) return -1 //-1 代表不換位置 return 1 //1 代表兩個交換 }) console.log(arr) === //要由大排到小 arr.sort(function(a, b){ //想像成 a 是排在前面的數字、b 是排在後面的數字 if (a===b) return 0 if (a > b) return -1 //-1 代表不換位置 return 1 //1 代表 a b 互換位置 }) //其他寫法1 arr.sort(function(a, b){ //想像成 a 是排在前面的數字、b 是排在後面的數字 if (a===b) return 0 return a > b ? -1:1 // 三元運算子 }) //其他寫法2 arr.sort(function(a, b){ //想像成 a 是排在前面的數字、b 是排在後面的數字 return b - a //　=== 0 ，代表兩者相等，所以回傳 1 不換；如果 > 0 ，不動，回傳 -1；如果 < 0 ，互換，回傳 1 }) ``` ### 易出錯 #### log & return 舉例 ``` function add(a,b){ console.log(a,b) //當 function 裡面沒有 return ，預設就是return undefined } console.log(add(1,2)) /* return: 1 2 undefined 因為先執行 add(1,2)，所以把 1 2 log 出來，接著因為 function 沒有 return 值，所以跑出 undefined ``` 在 chrome 裡面：沒箭頭：console.log 呼叫出來的興有箭頭：執行完的回傳值 #### Immutable 不可變原始型態：除了物件以外都是直接改變的： push, pass, reverse, shift, sort, splice, unshift 注意看 return 是什麼，例如 array.push 會直接改變原本的 array ，而且回傳新陣列有幾個元素不會改動的：通常代表它回傳的東西本身不是一個 array 要搞不清楚是回傳新的還是改變，還是都有對於 number 和 string 來說，直接用 function 是沒有用的，要用一個新的變數來接 ``` var str = "hello" str.toUpperCase() //沒有用，因為 str 本身不會改變 str = str.toUpperCase() //才會把便的東西放進 str，是不同的存取空間 ``` 對於 object 和 array 來說，如果回傳的不是 array ，要用一個變數去接 ## ALG101 ### 參考資料 [[課程學習筆記 ]先別急著寫 leetcode — 一步步打造程式腦]([https://medium.com/@miahsuwork/%E8%AA%B2%E7%A8%8B%E5%AD%B8%E7%BF%92%E7%AD%86%E8%A8%98-%E5%85%88%E5%88%A5%E6%80%A5%E8%91%97%E5%AF%AB-leetcode-%E4%B8%80%E6%AD%A5%E6%AD%A5%E6%89%93%E9%80%A0%E7%A8%8B%E5%BC%8F%E8%85%A6-7ed12aaa4a3d](https://medium.com/@miahsuwork/課程學習筆記-先別急著寫-leetcode-一步步打造程式腦-7ed12aaa4a3d)) ### LIOJ 題目 leetcode: 幫你定義好 function 還有 input 的參數 `Ctr + d`：送出結果訊號 `Ctr + c`：直接關掉 1.直接執行、直接輸入，可是 window 好像不是 `Ctr + D` 2.直接呼叫 function 3.做一個 input.txt 的檔案，放入 .js // `cat input.txt | env node code.js` ### pseudo code > *打造工程腦* > > 第一步：**想解法** > > 第二步： pseudo code 虛擬碼 | 想解法 | 翻成英文 | pseudo code | real code | | ------------------------------------------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | | 1. 令 i = 1 2. 如果 i > 100，結束 3. `**如果 i 能被 2 整除，印出 i**` 4. i = i + 1 5. 跳回第二行 | 1. let i = 1 2. if i > 100, then exit 3. if i % 2 no remainder, print i 4. i = i + 1 5. jump to line 2 | 1. let i = 1 2. for (i from 1 to 100) do 3. if i / 2 no remainder, print i 4. end for | ![image-20200624142729188](C:\Users\柔均\AppData\Roaming\Typora\typora-user-images\image-20200624142729188.png) | JSON.stringfy(??) ### 型態限制 1. int： -2147483648 ~ 2147483647 2. JS 數字： Number.MAX_SAFE_INTEGER 3. 浮點數精準度問題 ### 解程式三寶迴圈、函式、判斷式 ## 作業注意 1. 解題小訣竅：把 function 大區塊先寫出來，再填肉。 2. 印出/輸出：要 log 出東西，在 function 內用 console.log 回傳：在 function 內用 return 回傳代表這整個 function 代表的值，但不一定要輸出大家一定要很清楚地知道 console.log 就只是「印出」，把任何東西印在你的執行環境上面。你在 Node.js 下 console.log，就會在你的terminal 上面印出東西。你在瀏覽器下 console.log，就會在瀏覽器的 console 印出結果。但你要知道的是，印出的結果是給誰看的？給人看的。所以對電腦來說，console.log 是沒有什麼意義的。 3. 寫方程式記得最後的output是return，不然會有很多undefined - NM 乘法表 1.字串跟數字做大小判斷 ```js let N = lines[0] //為什麼沒有取Number也可以運算? let M = Number(lines[1]) console.log('type of N before = ', typeof((N))) if(N<5){ console.log(true) } //字串本身也可以直接跟數字做大小判斷 console.log('N=',N) console.log('type of N after = ', typeof((N))) ``` 2.字串做數學運算之後變成數字 ```js let N = lines[0] //為什麼沒有取Number也可以運算? let M = Number(lines[1]) console.log('type of N before = ', typeof((N))) N++ //N 做數學運算之後會從字串變成數字 console.log('N=',N) console.log('type of N after = ', typeof((N))) ``` 3.輸出組合時用`,`還是`+`? `console.log(i,'*',j,'=',(i*j))` => 不會通過 `console.log(i+'*'+j+'='+(i*j))` => 通過 - 水仙花數 1. `typeof lines= object typeof lines[0]= string` 2. `.split(' ')` `var tmp = lines[0].split(' ')` //切開之後要把結果用另一個變數存，沒辦法直接改原本的東西 ## Issue - #### 沒有該指令 ~~run~~ => `start <file>` in window，`f12` then ~~node~~ => 要下載 node.js - node -v `Uncaught ReferenceError: node is not defined` - .js 的檔案到底可以用什麼開？暫時用 freecodecamp - 怎麼做出一個 array 讓判斷條件對應？ BMI 題目 - 名詞搞混區 - Git Bash 是什麼? Windows 版的 Git 模擬器，也可以當 cmder 使用(?) - node.js 是什麼? npm 呢? 可以讓 terminal (?) 執行 js 的軟體(?) > **npm** > node package management，管理 JS 套件的系統。 > > node.js 的預設管理套件工具。裝 node.js 的同時也會一並自動安裝。 > > - `npm init`：啟用，會在專案資料夾內新增一個 package.json 檔 > - `npm install <套件名稱>`：安裝套件，安裝完成的套件會統一放在 node_modules 資料夾內。 > - `var <變數名稱> = require("<套件名稱>")`：在檔案內引入套件來使用 - VS code 是什麼? 可以在上面打 - 小偷題目，exchange 在當成function寫，怎麼改陣列裡的數字(?) ## 參考資料 1. [JS101 筆記](https://hackmd.io/@keronscribe/js101-note#JS101-筆記) by 第三屆 Cian 2. [Introduction to JavaScript](https://hackmd.io/@laiyenju/introduction-javascript) by 第四屆 Yen (Lai Yen Ju) 3. [JavaScript - 變數,陣列,函式](https://hackmd.io/DzIhhWOzRrCHBOX1So5E8Q?view#新增元素1) by 第三屆 ruofanwei 肉丸

Read more

CSS 整理 (待補充)

Lidemy 程式導師實驗計畫第四期 Laila 筆記

[JS102] 升級你的 JavaScript 技能：ES6 + npm + Jest 課堂筆記

Command Line 簡介與語法整理

Lidemy 程式導師實驗計畫第四期　Laila 筆記