前言在之前我們學習了一種不重複元素的集合，本文我們繼續討論另外一種不重複值的資料結構：字典（Dictionary）和雜湊表（Hash Table）。在集合中我們主要關心的是值本身 { 值（value）： 值（value）}，在字典（Dictionary）和雜湊表（Hash Table）則是有 { 鍵（key）: 值（value）} 之間的 mapping 關係。 什麼是字典（Dictionary
前言上個月我們介紹過 Web Component，大致上把 Web Component 的相關知識都介紹一輪了，也提供了一些範例，但是並沒有製作出一個完整可用的元件，因此今天就好好的來實做一個簡易又實用的 Web Component（對我來說很實用啦…），並且將他發佈到 Webcomponent.org 上面。最後也會說明一下我嘗試將我製作的 webcomponent 與 react 整合的心得。 開始前還是先給大家看一下看完這篇文章後
Update:經過朋友指出文章中缺漏的地方，於 2/26 早上新增一段講 SameSite Cookie 的段落。感謝 shik 的提點。 前言最近剛好碰到一些 CSRF 的案例，趁著這次機會好好研究了一下。深入研究之後才發現這個攻擊其實滿可怕的，因為很容易忽略它。但幸好現在有些 Framework 都有內建防禦 CSRF 的功能，可以很簡單的開啟。 但儘管如此，我認為還是有必要瞭解一下 CSRF 到底在幹嘛，是透過怎樣的手段
前言這次想跟大家介紹一個好用的工具 - SMACH (唸法同 smash)。SMACH 的存在意義是為了讓大家可以用系統化的方式來撰寫機器人的行為。這個系統化的方式是 Finite State Machine，概念上跟之前介紹過的 ecto 的 graph 概念有點相似。 簡單來說，就是讓我們可以很方便地定義機器人的各種狀態，所以機器人就不再只是根據程式碼裡面寫定的一連串行為去行動，而可以根據各種不同的條件進行狀態的切換。舉例來說，一個
什麼是集合（Set）？集合是一個源自於數學理論中擁有不同元素的集合： N = {0, 1, 2, 3, 4, 5, 6, …} 空集合：{} 其特性在於它是由一組無序且不重複的項目組成。你也可以想成是一個沒有重複元素和無順序的陣列。在這篇文章我們會介紹如何實作集合資料結構並使用 交集、聯集、差集等集合操作方式。 集合初體驗事實上，在 ES6 中就有原生的 Set，在這邊我們試著使用 JavaScript 物件模仿 ES6 的
前言建構網頁佈局是製作網站的基本動作之一，隨著設計多樣性與功能複雜度的提升，開發者必須利用 table, inline, float, clear, 或是 positioning 等方式來 hack 頁面配置，但不管是哪種方式都各自有其缺乏的功能，也因此催生出許多 CSS Framework 提供的 Grid System 來加速佈局開發。 幾年前出現的 FlexBox 宛如神兵利器，讓我們可以擺脫這些困擾，快速進行排版，而隨著 CSS
前言我自己很喜歡看一些面試的文章，因為可以從裡面學到許多，如果有面試題目的話那就更棒了，可以邊看邊想，測測看自己的實力。這篇文章是我前一陣子面試某間公司的歷程跟一些心得，希望對大家會有幫助。順帶一提，最後是有拿到 offer 的。 我面試的職缺叫做 Software Engineer，軟體工程師，四次面試都是中文的（我原本以為會有英文）。HR 有先跟我聊過，我有說我比較想要做前端，所以有些面試的考題會比較偏前端。但因為這間公司也很注重
前言最近因緣際會，複習了一些基礎的資料結構。在看到 Hash Table 的時候，也順便看了一下他的時間複雜度。不看還好，一看不得了，怎麼那麼小 (插入元素、移除元素跟找某個元素大概都只要 O(1) 的時間複雜度)！所以想要用很簡潔白話的方式說明一下 Hash Table 這個好用的資料結構。 簡介 Hash TableHash Table 是儲存 (key, value) 這種 mapping 關係的一種資料結構，從圖中可以很清楚地看
前言Java 和 JavaScript 雖然名稱相似，但卻是熱狗和狗的差別。JavaScript 是由 Netscape 工程師 Brendan Eich 於 1995 年僅花 10 天所設計的程式語言，也因為一些歷史因素，JavaScript 成為被誤解最深的程式語言。JavaScript 是一種直譯式、基於原型（prototype based）的物件導向程式語言，但又具有函數式程式設計（Functional programming
前言先前研究 Progressive Web App 的時候就有注意到 Web Components 這個東西，也看過公司前輩使用過，甚至在前陣子 GDG DevFest Taipei 2016 的官方網站內，不僅使用 PWA，也採用了 Web Components 的技術（當然應該是用 Google 的 Polymer）來搭建。但還是很少看人使用與談論，我自己也是從來沒有仔細研究過（汗.. 我稍微搜尋一下，大部分的介紹文章都是2013