KD's Tech Blog

Hi, 我是 KD Chang 張凱迪，我在這書寫我的軟體開發/程式設計技術筆記 | KD 技術部落格

JavaScript 箭頭函式 (Arrow Function）入門教學筆記 | 學習筆記

在 JavaScript 的 箭頭函式 (Arrow Function, =>) 中，this 的行為與傳統的 函式表達式 (Function Expression) 不同，主要特點如下： 箭頭函式的 this 綁定 箭頭函式不會建立自己的 this，而是繼承定義它的上下文（也稱為 詞法作用域 Lexical Scope）。 在箭頭函式內部，this 指向的是箭頭函式所處的外部函式的......

Posted by kdchang on 2021-01-16

async/await 入門教學筆記 | 學習筆記

async 和 await 是 JavaScript 中處理非同步操作的語法糖，它們使得非同步代碼更加易讀和易寫，避免了傳統回調函數（callback）或 Promise 的 .then() 鏈式調用的冗長性。 1. async 關鍵字async 是一個關鍵字，用來標記一個函數為「非同步函數」。非同步函數會隱式地返回一個 Promise，並且在函數內部，你可以使用 await 來等待非同步操......

Posted by kdchang on 2021-01-16

JavaScript Call Stack 入門教學筆記 | 學習筆記

在 JavaScript 開發中，理解 Call Stack（呼叫堆疊） 是掌握執行流程與錯誤除錯的關鍵概念之一。它決定了程式碼執行的順序，也與同步與非同步行為密切相關。本文將深入介紹 Call Stack 的基本原理，並透過實際範例幫助你理解它的運作方式。 1. 什麼是 Call Stack？Call Stack 是 JavaScript 引擎用來管理函式呼叫的結構，它遵循 LIFO（L......

Posted by kdchang on 2021-01-16

JavaScript let 閉包（Closure）入門教學筆記 | 學習筆記

什麼是閉包（Closure）？閉包是 JavaScript 中的一個強大概念，它允許函式「記住」其外部作用域（lexical scope），即使該作用域已經執行完畢並離開了執行環境。閉包使得函式能夠存取其外部函式內部的變數，而這些變數通常在外部函式執行結束後仍然可以被存取。 在 JavaScript 中，每當一個函式被創建時，它都會自動獲得對其外部變數的存取權，這就是閉包的核心概念。 閉包......

Posted by kdchang on 2021-01-16

JavaScript 物件導向（Object-oriented programming）入門教學筆記 | 學習筆記

1. 物件導向與 new 關鍵字JavaScript 是基於 原型 (Prototype) 的物件導向語言，而非典型的 類別 (Class) 為基礎的語言。但 ES6 之後，JavaScript 引入了 class 語法，使其更接近傳統的物件導向語言，如 Java 或 C++。 在 JavaScript 中，new 關鍵字用於建立物件，並且會執行以下步驟： 建立一個新的空物件。 設定該物件......

Posted by kdchang on 2021-01-16

JavaScript this 入門教學筆記 | 學習筆記

在 JavaScript 中，this 是一個關鍵字，它的值會根據執行環境的不同而改變。以下是 this 在不同情境下的行為： 1. 全域環境 (Global Context)在瀏覽器中，this 預設指向 window 物件： console.log(this); // 在瀏覽器中，this 指向 window 在 Node.js 環境下，this 則指向 global： console......

Posted by kdchang on 2021-01-16

JavaScript var 閉包（Closure）入門教學筆記 | 學習筆記

什麼是閉包（Closure）？閉包是 JavaScript 中的一個重要概念，指的是函式在創建時，能夠記住並存取其外部作用域的變數，即使該作用域已經執行完畢。這種特性使得 JavaScript 的函式可以擁有「記憶」的能力，允許函式保持對外部變數的存取權。 閉包的概念建立在 JavaScript 的詞法作用域（Lexical Scope）之上，也就是函式可以存取其被定義時所在的作用域中的變數......

Posted by kdchang on 2021-01-16

Vue3 Options API 和 Composition API 風格差異教學筆記 | 學習筆記

前言根據官方文件的說明，一般來說 Vue 元件可以用兩種不同的 API 風格來撰寫：Options API 和 Composition API。 Options API使用 Options API 時，我們透過一個包含 data、methods 和 mounted 等選項的物件來定義元件邏輯。選項中定義的屬性會在函式內透過 this 曝露，this 指向的是元件實例。 <script......

Posted by kdchang on 2020-11-16

關於 Web 網頁前端工程師 Frontend Engineer 的 10 個關鍵字

以下整理了前端工程師相關的 10 個關鍵字，涵蓋技能、工具與工作方式： HTML：前端結構的基礎語言，用於定義網頁的內容和結構。 CSS：用於設計網頁的樣式，包括佈局、配色和字體。 JavaScript：前端開發的核心語言，為網頁添加互動性。 React / Vue / Angular：主流的前端框架和函式庫，用於構建動態、模組化的應用程式。 Responsiv......

Posted by kdchang on 2020-06-13

JavaScript ES6 入門語法教學筆記 | 學習筆記

ECMAScript 6 又稱 ECMAScript 2015，是 JavaScript 語言的新一代標準，讓 JavaScript 可以更容易撰寫大型複雜的應用程式並避免不必要的錯誤。 以下介紹常用 ES6 入門語法： 一、let & const 變數宣告 let：用於宣告變數，可重新賦值。 let name = 'John';name = 'Mike......

Posted by kdchang on 2017-02-01

ABOUT ME
KD's Tech Blog 技術部落格 | KD Chang 張凱迪

KD Chang 張凱迪（@kdchang），台灣大學，主修經濟學，臺大資管所畢業。是一個軟體工程師，也是一位 PM 產品/專案經理和教育工作者。曾服務過上市網路軟體公司、上市科技電子公司、台灣 AI 人工智慧新創獨角獸公司，也曾參與數個新創組織的創辦和多個網路產品服務的開發。A Software Engineer, Product/Project Manager & Educator.:)

FRIENDS