理解 JavaScript 中物件的比大小行為

前言在 JavaScript 中很多行爲用其他程式語言的角度或是直觀角度來看都非常不合理。有些人知道這些行為,但不了解內部運作方式。而我自己在學習時,會嘗試了解內部的行為。了解過後,之後遇到同樣行為時,很自然的就知道某行為應該回傳什麼樣的值,而不再認為這是一顆地雷。 這篇文章要探討的是 JavaScript 在兩個物件中互相比較所用的依據為何。網路上大部分的文章都只有討論 ==, !=, === 以及 !==。這篇文章要探討的是 在兩個

Read More...

使用 JavaScript 處理二進位資料

由於高度封裝與抽象,JavaScript 的執行效率比不上 C 的語言。例如 JavaScript 的 Array 下標(subscript)是根據 hash key 而非實體記憶體位址 offset 取值,雖然方便,卻多了效能開銷。當 Canvas、WebGL、WebVR 開始走紅,效能越來越受重視,如何讓 JavaScript 達到如同 C 指標般操作 binary data 變得至關重要。

存在許久但最近才變為 ES6 標準「Typed Array」就是解放 JavaScript 操作 binary data 能力的好工具!一起來了解 Typed Array 吧!

(基於 ECMAScript 6+,Node.js 8.3)

Read More...

該來理解 JavaScript 的原型鍊了

前言老實說 JavaScript 的原型鍊一直是我很懼怕的一個主題,理由很簡單,因為真的不太好理解。光是一堆名詞跟錯綜複雜的關係就可以把你搞瘋,例如說prototype, __proto__, constructor, Object.prototype, Function.prototype, new等等。 可是呢,這又確實是 JavaScript 很重要的一部分,而且是面試的必考題,就算現在不懂,以後遲早有一天要把它弄懂,不然的話永遠

Read More...

用 JavaScript 學習資料結構和演算法:字典(Dictionary)和雜湊表(Hash Table)篇

前言在之前我們學習了一種不重複元素的集合,本文我們繼續討論另外一種不重複值的資料結構:字典(Dictionary)和雜湊表(Hash Table)。在集合中我們主要關心的是值本身 { 值(value): 值(value)},在字典(Dictionary)和雜湊表(Hash Table)則是有 { 鍵(key): 值(value)} 之間的 mapping 關係。 什麼是字典(Dictionary)? 建立字典類別 與 Set 的情況

Read More...

用 JavaScript 學習資料結構和演算法:集合(Set)篇

什麼是集合(Set)?集合是一個源自於數學理論中擁有不同元素的集合: N = {0, 1, 2, 3, 4, 5, 6, …} 空集合:{} 其特性在於它是由一組無序且不重複的項目組成。你也可以想成是一個沒有重複元素和無順序的陣列。在這篇文章我們會介紹如何實作集合資料結構並使用 交集、聯集、差集等集合操作方式。 集合初體驗事實上,在 ES6 中就有原生的 Set,在這邊我們試著使用 JavaScript 物件模仿 ES6 的 Set

Read More...

JavaScript 101 快速入門教學

前言Java 和 JavaScript 雖然名稱相似,但卻是熱狗和狗的差別。JavaScript 是由 Netscape 工程師 Brendan Eich 於 1995 年僅花 10 天所設計的程式語言,也因為一些歷史因素,JavaScript 成為被誤解最深的程式語言。JavaScript 是一種直譯式、基於原型(prototype based)的物件導向程式語言,但又具有函數式程式設計(Functional programming

Read More...

用 JavaScript 學習資料結構和演算法:佇列(Queue)篇

什麼是佇列(Queue)?佇列(Queue)是一種先進先出(First In First Out, FIFO)的有序串列(Ordered List),與堆疊(Stack)後進先出(Last In First Out, LIFO)不同的是佇列(Queue)的新增和刪除元素是發生在不同端,新增元素在尾部、移除元素在頂部,最新加入的元素會從尾部排入。在一般生活中比較常見的例子是電影院排隊買票、小七便利商店排隊付款(當然不能有人想插隊啦),在

Read More...

用 JavaScript 學習資料結構和演算法:陣列(Array)篇

什麼是陣列(Array)?陣列可以說是程式語言中暫時儲存資料的櫃子,幾乎所有的程式語言都具備陣列這個廣泛運用的資料結構,但值得注意的是一般程式語言中陣列只能儲存同樣型別的值,但在 JavaScript 則可以儲存不同型別的值(但我們還是盡量避免)。 下面是陣列的簡單使用情境,當今天我們想儲存整個班級的學生姓名時,我們不可能使用一個個變數去一個個儲存,這時候陣列的功能就派上用場了: 1234567const student1 = 'Ma

Read More...

讓 JavaSript 難以閱讀:jsfuck 與 aaencode

前言在進入今天的主題之前,先推薦大家看一個影片 WAT:A lightning talk by Gary Bernhardt from CodeMash 2012。在這個影片裡面,講者會為大家示範 JavaScript 到底有多「神奇」。而這些神奇的特性,也會跟我們之後所要介紹的兩個東西有關。 先從 Brainfuck 開始大家有聽過 Brainfuck 嗎?顧名思義,就是會讓你超級頭痛的一個程式語言,只用下面這八個字元就可以寫出一個完

Read More...

用 JavaScript 學習資料結構和演算法:堆疊(Stack)篇

前言在 CS 江湖上曾傳言:程式設計 = 資料結構 + 演算法。在一般的大專院校裡,資料結構(Data Structure)與演算法(Algorithm)幾乎都是電腦科學(Computer Science)和資訊相關科系的基礎必修課,在這些課堂中多半是使用 C/C++ 或是 Java 進行教學,許多初學學生也因為對於這些語言的掌握度不夠,反而迷失在資料結構和演算法的世界裡,然而本系列文章將透過 JavaScript 去學習一些經典的資

Read More...