跳至主要内容

用 JavaScript 實作佇列(Queue)

· 閱讀時間約 4 分鐘
阿昇
Software Engineer

(2026/08/18 更新內容)

此篇為舊文章,我已經另外整理資料結構與演算法的筆記,可以參考資料結構與演算法


預備知識

了解本文內容之前需要具備的 prerequisite:

  • JavaScript 基礎知識及 ES6 語法
  • 物件導向觀念
  • Big O Notation
  • 資料結構的基礎理解
  • 資料結構 Singly Linked List

什麼是 Queue?

資料像排隊一樣,在隊伍(Queue)中,最晚到的會排在最後面,處理資料則會從最先排入的開始進行。

先追加的數據先處理的特性是 「先進先出」,即「First In First Out」縮寫「FIFO」。

用 JavaScript 實作堆疊(Stack)

· 閱讀時間約 4 分鐘
阿昇
Software Engineer

(2026/08/18 更新內容)

此篇為舊文章,我已經另外整理資料結構與演算法的筆記,可以參考資料結構與演算法


預備知識

了解本文內容之前需要具備的 prerequisite:

  • JavaScript 基礎知識及 ES6 語法
  • 物件導向觀念
  • Big O Notation
  • 資料結構的基礎理解
  • 資料結構 Singly Linked List

什麼是 Stack?

資料像紙本文件由下往上堆疊一樣,只能從最新追加的資料開始存取。

後追加的數據先取出的特性是 「後進先出」,即「Last In First Out」縮寫「LIFO」。

Stack source: Stack (abstract data type) - Wikipedia

用 JavaScript 實作雙向鏈接串列(Doubly Linked List)

· 閱讀時間約 11 分鐘
阿昇
Software Engineer

(2026/08/18 更新內容)

此篇為舊文章,我已經另外整理資料結構與演算法的筆記,可以參考資料結構與演算法


預備知識

了解本文內容之前需要具備的 prerequisite:

  • JavaScript 基礎知識及 ES6 語法
  • 物件導向觀念
  • Big O Notation
  • 資料結構的基礎理解
  • Singly Linked List

用 JavaScript 實作單向連結串列(Singly Linked List)

· 閱讀時間約 11 分鐘
阿昇
Software Engineer

(2026/08/18 更新內容)

此篇為舊文章,我已經另外整理資料結構與演算法的筆記,可以參考資料結構與演算法


本系列主要參考自以下資料:

  • 石田保輝宮崎修一演算法圖鑑
  • Colt SteeleJavaScript Algorithms and Data Structures Masterclass

這些資料對我理解演算法與資料結構幫助很大,沒業配純推薦。

此外,如果想以圖像的方式了解資料結構及演算法,也很推薦參考 VisuAlgo

預備知識

了解本文內容之前需要具備的 prerequisite:

  • JavaScript 基礎知識及 ES6 語法
  • 物件導向觀念
  • Big O Notation
  • 資料結構的基礎理解

以上內容不會在本文說明,如果想了解

什麼是 Singly Linked List?

Singly Linked List 的數據會排列成一直線,每個單位會有數據和指標,指標會指向下一個數據在記憶體中的位址。

Singly Linked List

數位產品開發的通識課:Design System

· 閱讀時間約 12 分鐘
阿昇
Software Engineer

延續系列文的想法,這篇文章的促成也是源自我在公司內部的技術分享內容,主要是想讓工程師或是剛踏入數位產品領域的人了解 design system。

Design System

何謂 Design System?

在網路上搜尋到的文章,給出這樣的介紹來:

A design system is a collection of UI components bound together by design principles and an overarching UX strategy. They are often presented with guidelines on how each component lives inside the larger user experience.

簡單來理解的話,design system 可以說是一套設計原則,用來規範所有 UI 元件並使產品呈現出一致的使用者體驗。

數位產品開發的通識課:產品設計流程

· 閱讀時間約 7 分鐘
阿昇
Software Engineer

進入現在的公司後,發現我們的工程師不太熟悉數位產品開發的設計階段,而我們的設計師也較難以和大家交流這樣的知識。

剛好我是從設計師轉換到工程師,所以在一次內部的技術分享上,和工程師們分享產品設計的內容,而這篇文章就是由那次內部分享的內容編寫的。

如上所述,這篇文章的目標群眾是想了解產品設計的工程師,但如果你不是數位產品領域的人,或許也可以透過這個文章對產品設計有一些了解。

Introduction to Web Accessibility

· 閱讀時間約 8 分鐘
阿昇
Software Engineer

What is Accessibility?

In general

Accessibility can be viewed as the "ability to access" and benefit from some system or entity. The concept focuses on enabling access for people with disabilities, or enabling access through the use of assistive technology; however, research and development in accessibility brings benefits to everyone.

A wheelchair accessible taxi with a rear ramp

Using styled-components to build a corporate landing page

· 閱讀時間約 5 分鐘
阿昇
Software Engineer

I am a front-end engineer of OmniSegment, and our team are dedicated to improving marketing effectiveness of our customers.

Recently, I took the job of renewing our corp landing page. Although building a static web page is not complicated, there are something deserved to be recorded at this moment, and perhaps this post can help others in the future.

Designing with Data - 第五章 執行階段

· 閱讀時間約 8 分鐘
阿昇
Software Engineer

前言

最近我在讀 Designing with Data|善用數據幫你打造好設計 這本書,因此有一系列的記錄,想直接參考這系列所有文章請看系列文連結

章節簡介

第三章提到了試驗框架的基礎,包含定義、執行、分析三個階段,而這這一章是講解 執行階段 的內容,會專注討論如何「設計」假設,將我們定義並選擇的假設打造成試驗項目。

在開始主要內容之前,作者強調

  1. 不要太快收斂到特定解決方案
  2. 雖然本書將打造假設和設計假設分為兩個章節,但其實這兩個活動經常一起進行

並提到對於沒有運用過數據的設計師來說,要把數據還有 A/B Test 結合到開發流程會很有挑戰性,但設計師應該要感到被賦予更多勇氣去承擔更多風險,這樣才能進一步磨練直覺。