卡斯伯提供的教學資源:


javascript

鐵人賽:一次只能做一件事情的 JavaScript

在 JavaScript 中,一次只會執行一段程式碼,相信看到這段大家心中都會有所疑惑,我們實作中可以大量發出許多事件,並重複執行不同的函式,這樣為何還是單執行緒 (single threaded) 的程式語言呢? 這段如果用純文字解釋較為困難,所以本篇會加入動畫讓大家更容易了解原理。 故事說明小明...

javascript

鐵人賽:JavaScript 變數的宣告與他的作用域

變數分為全域與區域變數,差異點在於宣告 (var) 的方式,就 MSDN 上的說明 在函式定義之外宣告的變數就是全域變數,其值可在整個程式中存取和修改。 所以我們可以使用函式來做兩個的分隔點,函式之內宣告的稱為區域,函式以外宣告的稱為全域。 全域性的變數在函數外宣告的變數則是具有全域性(或是包含全域...

javascript

鐵人賽:執行環境與堆疊

JavaScript 一次只能做一件事情,他會依據 執行環境 (Execution Context) 來一一執行工作內容,本篇系列文會用舉例的方式,讓大家用簡單的方式瞭解這些艱深詞彙。 全域執行環境與函式在一開始會登記一個函式在全域環境下(global context),然後這個全域環境下可以登記其...

javascript

鐵人賽:邁向 JavaScript 勇者之路 - 開始

iT邦幫忙的鐵人賽到目前是第四次參加,前幾次參加有兩次是 CSS,而本次是 JavaScript,主要原因當然是 JavaScript 即將要統治世界 (!?),僅只有 CSS 的能力很難體會這個世界的險惡美好。 JavaScript 能做的事情非常多,Web 端的應用僅是其中的一小部分,現在包含後...

tool

在 VSCode 啟用程式碼規範工具 (ESLint)

許多同學會詢問到程式碼怎樣寫可以比較整齊且符合規範,在 VSCode 中非常容易整合這樣的工具,這邊提供兩個方法給大家參考,不過記得兩者不能混用,使用時請擇一即可。 ESLint:比較正式的方法,有完整的文件規範,適合團隊使用 JavaScript Standard Style 插件:比較簡單的方...

life

從設計轉職工程師的原因及過程

跟很多人說過過去是 “設計師” 而現在轉職成前端工程師,這個轉換過程有兩個問題很多人長問到: 為什麼會想做工程師 設計師是怎麼轉成工程師的 先前都會一一的回答,但相關的故事其實挺多的,所以整理成一篇給大家參考囉。...

css

圖解:CSS Flex 屬性一點也不難

前幾篇有介紹過 CSS Grid Layout 的使用方法,當我們學習排版類型的 CSS 時,最好的方式是先作分類,以 Flex 與 Grid Layout 來說都有共同的特徵,就是他們有分為外容器屬性與內元件屬性。...

javascript

JavaScript 陣列處理方法 [filter(), find(), forEach(), map(), every(), some(), reduce()]

陣列處理技巧是 JavaScript 中非常重要的一塊,現在框架大亂鬥的時代,框架基本上對於 DOM 的處理都有屬於自己一套良好的方法。只要能夠對於陣列資料操作熟悉,配合框架就能夠將開發效率更上層樓。 本篇介紹到的方法有: filter() find() forEach() map() every...

life

JavaScript ES6 Promise

本文章有提供新的版本,可參考:JavaScript Promise 全介紹 Promise 一直都是 JavaScript 夢寐以求的功能,非同步的處理如果沒有使用 Promise 經常導致函式或資料無法正常的運作。本篇避開許多深度的詞彙,直接透過範例來瞭解怎麼運行。 簡單的 Promise 範例:...

life

CSS3 Grid Layout

CSS gird layout 在最近 Chrome 更新已經慢慢開始支援 (就是還很久才會完全支援的意思),這和 Bootstrap 或是 960 Grid 沒有任何關係,而是新的 CSS 語法。...

撰寫一篇文章需要花上非常多的時間,如果你關閉 Adblock (廣告阻擋器),我會非常的開心 🤗。 (╭(°A°`)╮))
撰寫一篇文章需要花上非常多的時間,如果你關閉 Adblock (廣告阻擋器),我會非常的開心 🤗。 (╭(°A°`)╮))