33 JavaScript Concepts: hướng dẫn nền tảng JavaScript
33 JavaScript Concepts đáng để bookmark vì một lý do: nó biến việc 'đọc tài liệu' thành một checklist bạn thực sự có thể hoàn thành. Định dạng danh sách phát huy tác dụng vì mỗi mục dẫn tới một bài viết riêng thay vì nhồi hết mọi thứ vào một README. Nó không dạy JavaScript từ con số 0, và nếu bạn chỉ lướt qua tên các khái niệm mà không mở trang liên kết thì coi như bỏ lỡ phần quan trọng nhất.
Hướng dẫn 33 JavaScript Concepts bao gồm những gì?
33 JavaScript Concepts là một repository trên GitHub do Leonardo Maldonado duy trì, sắp xếp các chủ đề JavaScript cốt lõi thành danh sách có đánh số, từ primitive types và closure cho tới async/await, event loop và các design pattern. Mỗi mục liên kết tới một trang giải thích đầy đủ kèm ví dụ code thay vì giải thích ngay trong README. Repo nhóm mọi thứ theo các mục như Fundamentals, Async JavaScript và Advanced Topics.
Cách hướng dẫn được tổ chức
- ✓Phần Fundamentals bao gồm primitive types, primitives vs objects, type coercion, equality operators, scope và closure, cùng call stack.
- ✓Phần Async JavaScript đi qua callback, Promise, async/await và generator/iterator theo trình tự thay vì các trang rời rạc.
- ✓Phần Web Platform bao gồm DOM, Fetch API và Web Workers -- những cơ chế nằm ngoài phạm vi cú pháp ngôn ngữ thuần túy.
- ✓Phần mở rộng 'Beyond 33' bổ sung các nhóm Language Mechanics, Type System, Objects & Properties, Memory & Performance, Modern Syntax, Browser Storage, Events, Observer APIs và Data Handling, nằm ngoài 33 khái niệm gốc.
- ✓Mỗi trang liên kết kết hợp phần giải thích với ví dụ code chạy được thay vì chỉ có văn bản mô tả.
- ✓Dự án đã được dịch sang hơn 40 ngôn ngữ, liệt kê trong file TRANSLATIONS.md riêng.
Vì sao nền tảng JavaScript vẫn khiến developer vấp ngã
Phần lớn tutorial JavaScript dạy cú pháp bạn chỉ dùng một lần rồi bỏ qua các cơ chế thực sự gây lỗi khi lên production -- vì sao == và === cho kết quả khác nhau, vì sao một Promise resolve trước khi setTimeout chạy, vì sao một closure giữ một biến sống sau khi hàm chứa nó đã return. 33 JavaScript Concepts tồn tại vì đúng những khoảng trống đó cũng là thứ các câu hỏi phỏng vấn JavaScript nhắm tới, và việc rải chúng khắp các bài blog chất lượng không đồng đều khiến chúng khó học thành một hệ thống.
Hướng dẫn này dành cho ai?
33 JavaScript Concepts phù hợp với developer đã viết JavaScript hằng ngày nhưng còn thiếu phần 'vì sao' đằng sau cú pháp -- người dùng được Promise nhưng chưa chắc giải thích được thứ tự microtask nếu bị hỏi. Nó cũng dùng được như checklist ôn phỏng vấn: đọc một khái niệm mỗi ngày là bao trọn các chủ đề hay xuất hiện trong phỏng vấn kỹ thuật JavaScript. Nó kém phù hợp hơn với người mới hoàn toàn chưa từng viết vòng lặp for, vì các mục giả định bạn đã biết cú pháp cơ bản và chỉ cần giải thích cơ chế.
Điểm mạnh
- ✓Mỗi khái niệm có trang riêng thay vì bị nhồi chung vào một README dài.
- ✓Phạm vi vượt xa mức cơ bản cho người mới -- có cả Proxy & Reflect, WeakMap & WeakSet và nội dung về engine JavaScript.
- ✓Giấy phép MIT. Bạn fork hay tái sử dụng thoải mái.
- ✓Các chủ đề được nhóm theo danh mục logic như Fundamentals, Async JavaScript, Object-Oriented JavaScript thay vì dồn vào một danh sách phẳng.
Hướng dẫn này còn thiếu sót ở đâu?
- △README không nói rõ các trang khái niệm liên kết được cập nhật thường xuyên tới đâu -- bạn có thể kiểm chứng cấu trúc repo nhưng không kiểm chứng được độ mới của từng trang liên kết.
- △Đây là danh sách để đọc, không phải khóa học có bài tập, quiz, hay cách kiểm tra xem bạn đã thực sự hiểu một khái niệm hay chưa.
- △Không có bước cài đặt hay sử dụng nào áp dụng vì đây là tài liệu để đọc, không có gì để chạy -- nếu bạn muốn một tutorial thực hành có REPL đi kèm thì đây không phải lựa chọn đó.
- △Mục lục đã phát triển vượt xa con số 33 ban đầu với phần 'Beyond 33: Extended Concepts', khiến cái tên hơi đánh giá thấp lượng nội dung thực tế có trong repo.
Lựa chọn thay thế để học nền tảng JavaScript
Câu hỏi thường gặp
33 JavaScript Concepts miễn phí -- đây là repository mã nguồn mở trên GitHub theo giấy phép MIT, và các trang hướng dẫn liên kết tại 33jsconcepts.com đọc được miễn phí, không cần đăng ký. Repo còn gắn tag hacktoberfest nên việc đóng góp ngược lại cũng không tốn phí.
33 JavaScript Concepts giả định bạn đã viết được JavaScript cơ bản -- biến, hàm, vòng lặp -- và muốn hiểu rõ cơ chế phía sau. Người mới hoàn toàn, chưa từng viết vòng lặp for, sẽ khó theo kịp các mục như closure hay event loop nếu thiếu nền tảng đó.
33 JavaScript Concepts là một danh sách các trang chủ đề độc lập thay vì một mạch nội dung liên tục. Bạn có thể nhảy thẳng tới closure hay event loop mà không cần đọc các chương trước đó, điều mà giáo trình theo trình tự thường không cho phép.
33 JavaScript Concepts bao gồm trực tiếp cú pháp ES6+ hiện đại: có các mục về destructuring, spread/rest operator, optional chaining, nullish coalescing, template literal, ES Modules và generator, bên cạnh class và các chủ đề cốt lõi khác. Phần mở rộng 'Beyond 33' còn bổ sung tagged template literal và computed property name.
33 JavaScript Concepts hữu ích cho cả hai -- các phần Fundamentals, Async JavaScript và Functional Programming áp dụng cho mọi runtime JavaScript, trong khi các mục như DOM, Fetch API, Web Workers thiên về frontend, còn closure và event loop cũng quan trọng với backend Node.js.
33 JavaScript Concepts đã được cộng đồng dịch sang hơn 40 ngôn ngữ, với danh sách đầy đủ được liên kết trong file TRANSLATIONS.md riêng của repo, nên người đọc không thạo tiếng Anh vẫn tiếp cận được bản gốc.
Trường hợp sử dụng tốt nhất
- •Học một khái niệm mỗi ngày như bài khởi động có cấu trúc trước một buổi phỏng vấn kỹ thuật JavaScript.
- •Tra cứu một cơ chế cụ thể -- ví dụ vì sao this hoạt động khác trong arrow function -- khi gặp phải giữa lúc code.
- •Tự đánh giá kiến thức JavaScript của bản thân bằng cách lướt qua danh sách và ghi lại khái niệm nào bạn chưa giải thích nổi.
- •Onboard một developer junior đã biết cú pháp nhưng chưa được dạy cơ chế bên dưới.
Repo liên quan
Chưa chắc 33-js-concepts có hợp với bạn?
Để ChatGPT, Claude hoặc Perplexity tìm hiểu giúp — bấm bên dưới và xem AI nói gì về 33-js-concepts.