Posts

Showing posts from October, 2020

浮點數計算

-
 二進制和十進制轉換過程中，產生的誤差範例： 0.1 + 0.2 = 0.30000000000000004 100 / 3     = 33.333333333333336 1/3 * 100 = 33.33333333333333 相關參考資料： 重新認識 JavaScript: Day 03 變數與資料型別 JavaScript 浮點數陷阱及解法 只有1%的Python 程式設計師搞懂過浮點數陷阱 IEEE-754 Floating Point Converter
Post a Comment
Read more

JavaScript: typeof operator

-
typeof null === 'object' 若想檢查某個項目是否為 object，而且要排除 null，可以寫： if (待檢查項目 && (typeof 待檢查項目 === 'object' || typeof 待檢查項目 === 'function')) {   console.log('This is an object.') } else {   console.log('This is not an object!') } typeof NaN === 'number' 若想檢查某個項目是否為 number，而且要排除 NaN，可以寫： if (Number.isNaN(待檢查項目) === false && typeof 待檢查項目 === 'number') {   console.log('This is a number.') } else {   console.log('This is not a number!') } 其他相關參考資料：  重新認識 JavaScript: Day 03 變數與資料型別 重新認識 JavaScript: Day 04 物件、陣列以及型別判斷  typeof - MDN
Post a Comment
Read more

寫 JavaScript 的推薦習慣

-
👻 'use strict' JavaScript 的嚴格模式 "use strict"  節錄：  現在會建議寫 JavaScript 的時候加入 'use strict'，這可以改正一些編寫時的不良習慣，但也有可以因此導致專案無法運作，此時可以考慮將 'use strict' 加在函式內，避免影響過去的程式碼及相關套件。 👻 避免型別強制轉換（coercion），因為轉換後的結果可能不符我們的期待 使用 ===，不使用 == 使用 !==，不使用 != 在運算前先自行檢查型別，例如： if (typeof a === typeof b) {   //先自行檢查型別   a + b                                     //再做運算 } else {   console.log('error') } 👻 盡量使用 let 和 const 宣告變數，不要用 var 宣告變數，以避免變數汙染的問題 👻不要將變數的值設為 undefined： 這樣一來，在 debug 時，若想釐清變數的值為什麼是 undefined，可以很方便地直接排除「我們將該變數的值設定為 undefined」這種可能性，而能直接確認，是由於我們沒有設定過該變數的值。
Post a Comment
Read more

我的 Visual Studio Code 設定

-
settings.json {     "editor.tabSize": 2,     "editor.wordWrap": "on",     "editor.formatOnSave": true,     "editor.formatOnPaste": true,     "workbench.settings.openDefaultSettings": true,     "javascript.validate.enable": false, //for Extension "StandardJS - JavaScript Standard Style"     "javascript.format.insertSpaceBeforeFunctionParenthesis": true, // 宣告函式時，函式名稱和 () 之間有一格空格     "editor.detectIndentation": false, // 儲存檔案時，讓 autoformat 縮排是兩格     "diffEditor.ignoreTrimWhitespace": false, // 儲存檔案時，讓 autoformat 縮排是兩格     "emmet.includeLanguages": {         "javascript": "html",     },     "vetur.format.defaultFormatter.html": "js-beautify-html", // format .vue html     "vetur.format.defaultFormatter.js": "vscode-typescript", // Let the js in vue formatted according
Post a Comment
Read more

CSS 起手式

-
Reset CSS /* http://meyerweb.com/eric/tools/css/reset/     v2.0 | 20110126     License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {   margin: 0;   padding: 0;   border: 0;   font-size: 100%;   font: inherit;   vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {   display: block; } body {   line-height: 1; } ol, ul {   list-style: none; } blockquote, q {   quotes: none; } blockq
Post a Comment
Read more

HTML 起手式

-
 <!DOCTYPE html> <html> <head> <meta charset=UTF-8>                          <meta name="viewport" content="width=device-width, initial-scale=1"> <title>                   </title>                     <!--在 head 末端引入 js 檔案-->                     <script type="text/javascript" src="檔案網址"></script>  </head> <body>                     <!--在 body 末端引入 js 檔案-->                     <script type="text/javascript" src="檔案網址"></script>   </body> </html>
Post a Comment
Read more

JavaScript/ HTML/ CSS 工具資源

-
JavaScript 語法觀念 寫 JavaScript 的推薦習慣 Operator precedence and associativity, grouping and short-circuiting  - MDN coding style： JavaScript Standard Style Guide  中，比較重要的規範： 2 格縮排 字串使用單引號 沒有未使用的變數 沒有分號 關鍵字後加空白 函式名稱後加空白 永遠使用 === Airbnb JavaScript Style Guide Google JavaScript Style Guide Idiomatic JavaScript Style Guide JavaScript: The Good Parts JavaScript 的 Reference 遊戲 深入探討 JavaScript 中的參數傳遞：call by value 還是 reference？ 小心地雷 重新認識 JavaScript 系列 JavaScript 全攻略：克服 JS 的奇怪部分 JavaScript 常見大坑與細節 JavaScript: typeof operator 浮點數計算 型別強制轉換（coercion），範例： 3 < 2 < 1  // true  (3 < 2 是false，為了計算 false < 1 的值，false 轉換成 0) 1 + '2'  // '12'  (數字 1 轉換成字串 1) JavaScript Type Conversion - W3S JavaScript-Equality-Table  (==, ===, if() ) Equality comparisons and sameness  (==, ===, Object.is, SameValueZero) - MDN 繪製流程圖 Draw.io Google Drawing 程式碼編輯器（text editor） Visual Studio Code： 我的 Visual Studio Code 設定 Sublime Text Atom Vim Emacs Brackets WebStorm  編輯器套件（extension） 自動修訂語法格式： JSLint
Post a Comment
Read more