前些日子我寫了篇關於 functional programming 的文章 (Functional Programming 一文到底全紀錄)，講述了當時對 FP 的學習心得，與在實務中應用後的一些想法。 之後陸陸續續收到了一些反饋，有人詢問：「FP 能做的事情，現在 OOP 都做得很好，什麼情況下需要用到 FP？」 關於這個問題，我的回答總是 FP 準則中的「避免副作用」、「一個 Function 只做一件事情」、「以 Function 為程式的最小單位」能使我們只需要關注…
前言這篇文章將為排序篇章做一個結尾，文章會介紹選擇排序 (Selection Sort) 與插入排序 (Insertion Sort) 兩種排序法，透過上圖的排序法複雜度一覽表可以發現他們的執行效能相比其他排序法來的差一點，因此比較不常被使用，但要強調的是他們仍然有適合使用的情境，本篇文章將會簡單紀錄這兩個演算法的定義與程式碼實作。選擇排序法 (Selection Sort) 選擇排序法示意圖簡單來說選擇排序法一直重複的做兩件事:從尚未經過排序的陣列中找到最小值將當前找到最小值擺到最左邊時間複雜度 O(n²)程式碼範例這邊先設陣列的第一個數字是目前的最小值，然後往後把陣列的數值一個一個讀取，如果讀取的下個數比最小值大，就不作處理。而如果讀取到的數比目前的最小值小，就把目前的最小值換成這個數。重複這個方法把所有陣列裡的數都讀過一遍，就能確保目前的最小值為整個數列的最小值，扣除掉已經確定的最小值，剩下未確定的元素再重複執行以上步驟，直到陣列完成排序。function selectionSort(array) { const length = array.length; for(let i = 0;…
氣泡排序法 Bubble Sort其實氣泡排序法算是最容易理解的排序法，也常作為初學者入門學習的演算法，相信經過前兩篇較為複雜的快速排序法、合併排序法後，可以快速理解氣泡排序法的內容與實作方法。氣泡排序法定義氣泡排序法的過程會從陣列最左邊開始將元素兩兩比較，每一輪都會把最大的數值移動到陣列末端，這個行為就好像氣泡不斷從底部冒出一樣，因此被稱作氣泡排序法。氣泡排序法的實作步驟如下：比較相鄰的兩個元素，若前面的元素較大就進行交換。重複進行1的動作直到最後面，最後一個元素將會是最大值。重複進行1,2的動作，每次比較到上一輪的最後一個元素。重複進行以上動作直到沒有元素需要比較。 把文章一開始示意圖的第一部份拆過來看，一開始把陣列的第一個元素跟第二個元素比較，如果前面的元素比後者大，就將兩元素交換，如果前者元素比後者小，就不做調整。這邊因為 5 比 1 大，因此將兩元素交換，接著看第二個元素跟第三個元素，依此類推，最後會將陣列中最大的元素放到陣列最後頭，接著重複以上步驟，直到所有元素都經過排列，排序才結束。時間複雜度因為實作會使用到雙重迴圈，因此平均時間複雜度為 O(n²)平均： O(n^2)空間複雜度因為沒有額外建立其他資料結構，因此空間複雜度為：O(1)程式碼範例function bubbleSort(array) { const length = array.length; for (let i = 0;…
找不到好圖就亂畫 xDD 型別和值 是一個程式語言很重要的基石， 我們期待 “42” 、42 兩者表現會有不同， 前者我們期望他有字串的特性可以使用， 後者我們常用於數字運算的特性。 這也就是為什麼我們程式撰寫中，很重視基礎的型別和值。 而程式語言中，有兩種常見的特性： 1. 強型別語言 2. 弱型別語言 對於兩者的定義，各種地方都有不同的意見， 在此定義參考 Kyle Simpson ， 我們透過使用變數的時機，來決定是強/弱型別語言。 也就是說，如果一個變數，在宣告的時候指定型別， 那麼，我們說他是一個「強型別語言」。…
Photo by Hitesh Choudhary on Unsplash 前言 這是一系列我參加完鐵人賽的整理， 最近也透過 火箭隊軟體工程師培訓計畫（高雄） 的場地， 舉辦一系列實體的讀書會導讀， 已經進展到一半了，每次約 3 小時，一週一次已經連續約一個月左右。 透過實際寫過文章、實際講過 YDKJS 這個系列， 這次回顧，把一些真正重要的「大綱」整理出來。 這部分主要會分享一些「自己」的看法， 如果想知道 YDKJS 作者 Kyle Simpson…
哄女朋友最高的境界是什麼？ 除了用心之外，每天不重複的年言蜜語必然是少不了的。雖然國文老師上學的時候也教了一些東西，但是日子長了必然「江郎才盡」。 大家都是混科技圈的，借助自動化的手段能不能一次性的解決問題呢？ 稱霸 GitHub 熱門榜數天的「哄女友神器」 嗯，顯然是可以的。Github 作為全球最大的同性交友網站，工程師們不僅可以在上面交流寫程式的技巧，還能學到如何開發一個自動哄女友神器。 先附上 GitHub 地址：（傳送門） 這個自動給女友發送微信暖心話的項目，已經連續霸榜 Github 趨勢榜好幾天了。作者用 Python3 和 Itchat 微信介面開發了一款小工具，可以定時給朋友發送每日天氣、提醒、每日一句。通過圖靈機器人，也可以智慧自動回覆信息。 操作簡單且容易上手，即使是新手，只要配置好了 Python 環境，安裝好必要的 Python 數據庫，下載程式碼之後，只要 CMD 一下即可實現。 首先，我定的時間是 22:20，一到時間文摘菌的帳號就收到了發送的信息，包括英文和中文情話。北京的天氣以及在一起的多少天。 調整圖靈機器人之後，兩個帳號便可以對話，圖靈機器人還算強大，當我發送：這是個測試之後，圖靈機器人回覆：你不放心我嗎？ 備註：工具項目中的天氣信息來自 SOJSON API 介面，暖心情話來自金山詞霸上面的每日一句，還有英文版。圖靈機器人使用需要申請密鑰，每天免費數量只有 100 條。如果使用超過了，可使用青雲客智慧聊天機器人，這個不限制次數。 手把手教學示範 首先，把 Python 安裝好，並配置好環境，個人建議新手安裝 anaconda，具體安裝教程，可自行 Google 搜尋。 然後安裝必要的 Python 數據庫，環境配置好的同學可以直接用 pip…
常用 Python 的你，真的了解他嗎？ 一位來自義大利的工程師顛覆網友們對 Python 的想像！ 他不做常見的爬蟲、資料分析與視覺化，他做出能辨識動作的神經網路！真的太強大啦！ [以下為自原文翻譯之內文] 打造舞步來控制電源 在今天的文章裡，我將教大家訓練一個神經網路模型，可用來識別鏡頭錄下的「舞步」，並用這些「舞步」控制燈的開關。 我們將在已有的 OpenPose 深度學習模型上建立我們的模型來識別身體位置，然後我們會建立一些樣本來代表身體的各種麼樣。 當我們建立好舞步和其他姿勢的樣本後，我們會清理數據集，然後利用這些樣本來訓練我們製作出的神經網路。 當神經網路訓練好之後，我們會用它來控制燈光。 今天的文章包括很多步驟，不過，所有的程式碼都在 Github 上，上面還包括了我已經蒐集到的原始數據樣例。 使用數據集建立自己的神經網路 首先就是大量的數據。…
本文原文撰寫於2017年，部分資料可能因時空背景而有不同。 如果你不曉得該如何為你的產品選擇一個合適的前端框架，這篇文章也許可以給你一些啟發。 一個有趣的事實是：IBM 發表的 2017 年最值得學習編程語言名單中，JavaScript 榜上有名。 正是這位 IT 巨頭指出，JS 在網站中驚人地達到 94.4％ 的使用率，而且「不太可能降低」。 JavaScript 能確保「對用戶非常友好的網頁，因為它負責整個 web 界面，包括動畫和交互」。 不管你怎麼看，JavaScript 很重要。 這也指明了潛在 Web…
上回這裡成功的建置環境後，進入下個環節的討論。就是在接觸框架之前，其實並不是非常明白所謂的架構，就會常常出現各種功能混在一起的情況，像是一個Js事件需要同時處理「資料變動」、「樣式修改」或是「資料處理」以及「後端互動」，雖說在開發時都算順利，但過了幾天後回來開發，或是後來要針對網站進行改動維護，卻完全不知該從何下手，而這也就是框架最大的價值，他讓我們在開發時，每一段Code可以專注處理某一個部分的任務，結構分明，在維護上也能更加輕鬆。 開始使用Vue.js 在Vue的官網其實有明確指出「建議不熟悉Vue或是node.js環境使用的開發者先不要使用Vue-Cli」，所以建議一開始接觸Vue.js框架可以先從CDN開始熟悉，基本上只需要在HTML檔的 <head> 中引入CDN即可使用： //開發者模式版本 <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> //產品開發使用的穩定版本 <script src="https://cdn.jsdelivr.net/npm/vue"></script> 創建Vue實例 在引入CDN之後，要讓網頁能夠成功顯示需要有兩個要件，分別是模板 (Template)與實例 (Vue Instance)，模板可以直接建立在HTML檔中，而實例則是Vue的Javascript物件實例，首先我們先從實例開始說起。 Vue的實例主要是關注資料面的操作，他會負責控管資料以及處理資料，而在Vue的實例中，物件的屬性與方法是有既定寫法的，最核心的屬性設定有 el 以及 data ，el 是指Vue實際掛載在DOM的哪一個節點，通常這個屬性會設定為 "#app" ，這個「掛載」的觀念會在後面的章節中做解釋，這邊可以先把他理解為Vue實際能在DOM中的作用範圍，如果超出這個節點，Vue就無法控制了；接著 data 則是這個頁面會使用到的資料，寫法就是 Object ，key是在模板使用的資料名稱，Value是資料的實際內容，像下方的範例就是我們在Vue中建立了一筆資料，資料的變數名稱叫作 text ，而資料內容是 "Hello World!"： var…
在上回這裡對Vue有了基礎概念後，在開寫Vue之前肯定需要經歷一番環境建置的陣痛期啦～不過其實在建置Vue.js的環境我個人覺得還算友善，不像某Tensor開頭的機器學習框架，要建立GPU計算的環境真的是弄到懷疑人生......，今天就來跟大家分享一下小弟在建置Vue.js環境時遇到的過程以及遇到的狀況 首先，那個Node.js與NVM (Node Version Manager) 因為在學習Vue之前我主要都是利用SFTP auto save上傳到Host然後再看改動的方式開發，基本上沒有接觸過本地端的開發方式，所以也沒有使用過Node.js的經驗，所以在安裝Vue之前必須先進行Node.js的環境安裝，基本上這也是在所以過程中最讓我印象深刻的地方。 安裝Node.js有幾種方式，第一種就是直接上Node.js的官方網站下載直接安裝，我一開始也是直接利用這種方法，但後來後悔了；第二種是利用Node的版本控制工具 - NVM進行安裝，這是我蠻推薦的作法，畢竟在開發或維護不同的專案時，每個專案開發時的Node版本可能不盡相同，所以這時候NVM的優勢就是可以讓我們直接快速地進行Node.js的版本切換，不用再刪除重裝之類的。 要安裝NVM的方法基本上非常簡單，只需要使用他們官方的Github上說明的指令，即可在Terminal進行安裝： curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.2/install.sh |…