Sub-pillar 9.3 · JavaScript + TypeScript

Học JavaScript chính quy

Bạn có thể đã viết JavaScript hằng ngày — nhưng có bao giờ hiểu vì sao 0.1 + 0.2 !== 0.3, vì sao typeof null === 'object', hay event loop chạy thực sự như thế nào? Sub-pillar này dạy JavaScript như ngôn ngữ chính quy — 12 chương, từ ES2024 đến TypeScript 5.4+.

ES2024+ TS 5.4+ · 12 chương · ~10,800 dòng · 60+ bài tập + quiz

Lộ trình 12 chương

Chia 2 phase: JavaScript core (chương 1–8) + TypeScript (chương 9–12). Mỗi chương ~700-1200 dòng, có: lý thuyết chi tiết, code chạy được, visualizer, 4-5 bài tập, 7-8 quiz, tổng kết. TypeScript chương dùng accent xanh để phân biệt.

Phase A — JavaScript Core (chương 1–8) Ngôn ngữ JS thuần: types, functions, async, modules. Chạy được trên cả Node lẫn browser.
01

Hello JavaScript

3 nơi chạy JS (browser, Node, Deno/Bun), npm, package.json, Vite intro, tooling baseline.

Đọc →
02

Variables, Types & Coercion

let/const/var, 7 primitive types, type coercion gotchas, == vs ===, truthy/falsy.

Đọc →
03

Functions, Scope & Closures

4 cách định nghĩa function, this binding (4 rule), scope chain, hoisting, closure pattern.

Đọc →
04

Objects, Prototypes & Classes

Object literal, prototype chain, class syntax, private field #x, composition vs inheritance.

Đọc →
05

Arrays, Iterables & Iteration

map/filter/reduce, mutating vs non-mutating, iteration protocol, generator, Set/Map/WeakMap.

Đọc →
06

Async JavaScript

Event loop chi tiết, Promise, async/await, microtask vs macrotask, AbortController.

Đọc →
07

Error Handling & Patterns

Error class hierarchy, custom Error, try/catch async, Result type pattern, global handler, anti-pattern.

Đọc →
08

Modules, Bundlers & Runtime

CommonJS vs ESM, named/default export, dynamic import, tree-shaking, Vite vs esbuild vs Webpack.

Đọc →
Phase B — TypeScript (chương 9–12) Type system, generic, utility & advanced types, tsconfig. Áp lên JS core đã học.
09

TypeScript — Type System Foundations

Setup tsconfig, primitive type, union/intersection, narrowing, type vs interface, unknown/any/never.

Đọc →
10

TypeScript — Generics & Utility Types

Generic function/class, constraint extends, Partial/Pick/Omit/Record, default type param.

Đọc →
11

TypeScript — Advanced Types

Conditional types, infer, mapped types, template literal types, key remapping, recursive types.

Đọc →
12

TypeScript — Compiler & Tooling

tsconfig đầy đủ, strict mode, module resolution, .d.ts, setup Node/Vite/library, typed patterns.

Đọc →

Tại sao học JavaScript chính quy?

🧠 Mental model

90% người viết JavaScript học qua "copy-paste Stack Overflow" — gõ được code chạy nhưng không hiểu vì sao. Khi gặp bug khó (closure rò state, this mất binding, Promise reject không catch), không có khung tham chiếu để debug.

Sub-pillar này đi từ nền tảng: event loop, type coercion, prototype chain, scope chain — những thứ là nguồn của mọi bug. Học xong, bạn không chỉ "viết được JS" mà còn dự đoán được code sẽ làm gì.

💡 Đối tượng phù hợp

Đã viết JS một thời gian nhưng muốn hệ thống lại — ideal. Mới học JS từ zero — cũng OK, chương 1 không assume kiến thức trước. Mỗi chương có callout so sánh với Dart (nếu bạn vừa học Dart).

⚠️ Cảnh báo

Tài liệu JavaScript trên internet cực kỳ phân mảnh, nhiều bài cũ dạy var + callback hell + bundler Webpack config phức tạp. Sub-pillar này 100% modern JS (ES2024+): let/const default, async/await thay callback, Vite thay Webpack cho dev.

Quan hệ với các sub-pillar khác

Mỗi chương có section "Connects to" cuối, trỏ tới chương khác trong Pillar 9 hoặc trụ cột nền tảng. Ví dụ: chương 6 (Async event loop) đối chiếu với Dart Chương 7 (Future & Stream); chương 9-12 (TypeScript) áp dụng pattern OOP từ trụ cột 6 OOP với type modeling rõ ràng.

Học xong 12 chương JavaScript → mở Python sub-pillar (10 chương) để có 2 ngôn ngữ scripting/server-side trong tay.