Programming

命名，是程式設計領域老掉牙的議題，從變數命名到函式、物件的命名，未必有多少人將這件事做好，你真的明白為何變數命名重要嗎？ 此外，除了最基本的變數名稱要有意義外，常見變數命名方式如匈牙利命名法、駝峰命名法等等，又該如何選擇呢？ 這邊將簡單跟大家分享我對於變數命名的一些想法。 ...

在電腦上進行前端開發時，瀏覽器會提供方便的開發者工具，讓我們可以檢視錯誤訊息、儲存區內容、逐步執行 JS 等等，但如果要用行動裝置測試網頁，該如何開啟強大的開發者工具呢？ 畢竟小小的螢幕，總不可能開在手機裡吧！ 這邊分享 iOS Device 的情況下，可以和 Mac 電腦連線，使用 Mac Safari 的開發者工具來遠端遙控 iOS Safari 的網頁，讓你用 iOS 測試網頁更方便。 ...

要在 JavaScript 計算函式的執行時間，可以用現在的 Timestamp 和函式執行後的 Timestamp 相減，即可獲得執行時間，大多數人都會用 new Date().getTime() 來取得時間戳，但如果你的函式執行時間小於 1 毫秒，就會因為 Timestamp 最小單位只到毫秒而無法計算執行時間，因此在這建議使用 Window.Performance API，它可以提供從網頁載入到現在的豪秒數，精確度到千分之一毫秒。 ...

用一句話形容今天，大概是「第一次學 Capybara 踩地雷就上手」，花了整整六小時(以上)在寫兩個簡單的測試，途中遇到各種有趣的地雷，不寫一篇文章紀錄這慘烈的一天我怕今天氣到睡不著覺。 先聲明，這是第一次寫測試，所以有些觀念可能是錯誤或過舊的，歡迎大家留言告知，一定立刻修改，這不是一篇技術文，而是一篇發洩文（怒） ...

在 JavaScript 使用 String.replace 時要注意它可能和你預期的行為不同，當你想取代某個字串時，你會發現 replace 只取代了第一個字串，例如 “AAA”.replace(“A”, “B”)，你預期會得到 “BBB” 但實際上你會得到的是 “BAA”，這是因為 JS replace 的第一個參數其實是 Regex 而非字串，如果你輸入字串，就只會取代第一個遇到的字串，導致和預期不同的問題。 ...

在 JavaScript 當道的今日，使用 JS 進行網頁的操作如 Ajax、頁面切換、彈出視窗等等越來越常見，甚至進一步出現了 React JS、Vue JS 等可以幫助你開發 Single Page Application (SPA) 的 JS Framework；在使用 JS 進行網頁操作時最怕的問題莫過於網址的變化與歷史紀錄，例如透過 jQuery 進行頁面切換後，因為是 JS 的行為所以網址不會變化，而且當使用者按下瀏覽器左上角的上一頁時，會直接回到別的頁面，因為在歷史紀錄裡面不會紀錄 JS 的操作（事實上也無法紀錄），要解決這一系列問題，可以透過 HTML5 提供的 history.pushState、history.replaceState 以及 onpopstate 事件來解決。 ...

「踩你千萬遍也不厭倦的愚蠢行為」，我一直以為錯誤的寫法只要遇過一次就會長記性，但今天在公司又踩地雷三小時，始終搞不懂問題在哪裡，最後很認真把程式碼重看過一次後發現… 原來又是一樣的問題。 一句話：「不要擅迴圈裡面刪除任何陣列元素」 ...

前陣子在嘖嘖看到「湊整數」功能，比如結帳時 1359 元，按下湊整數按鈕後會變成 1400 元，這其實是個蠻有趣的功能，但實作時才發現湊整數並不好做，有很多非技術面的顧慮，這邊就紀錄我在實作所遇到的問題、過程以及最後的解法吧！ ...

Ngrok 是後端開發者必備的神器，每次在本機 localhost 開發網站時，遇到 webhook、API Callback、OAuth 都會很頭痛，以之前開發 Mandrill Webhook 接收開信、發信事件為例，因為要設定網址在 Mandrill 後台才能測試，所以程式寫完後要上傳到伺服器才能知道結果，對於開發速度會造成蠻大的影響，而 Ngrok 就是為了解決這樣的問題而誕生！ ...

透過 Cross-Origin Resource Sharing（以下簡稱 CORS）的設定可以讓 JavaScript 突破瀏覽器同源政策，存取不同網域的資源（API），但每次設定完 CORS 都很頭痛要如何判斷伺服器真的有設定成功，因為有時候瀏覽器針對 CORS 會做快取，導致伺服器設定無誤，但不管你怎麼重新整理網頁都失敗的現象。這邊教大家用 cURL 直接檢視 header 是否有啟用 CORS 囉！ ...