Học Javascript 4: Hiểu rõ khởi tạo và hoisting
Bài viết giải thích hiện tượng hoisting trong JavaScript - cách JavaScript xử lý khai báo biến và hàm trong quá trình thực thi code. Tác giả phân tích chi tiết về các giai đoạn Creation Phase và Execution Phase, đồng thời cung cấp các ví dụ minh họa để giúp người đọc hiểu rõ cách JavaScript đưa khai báo lên đầu phạm vi trước khi thực thi.
Giới thiệu hoisting
Cho đoạn code sau:
Bạn có thể đoán được kết quả in ra console là gì?
Oke, bây giờ chúng ta thay đổi code một tý:
Lần này bạn đoán kết quả là gì nào?
Ở một số ngôn ngữ khác, nếu làm như vậy sẽ báo lỗi. Nhưng trong Javascript, chúng ta không thấy lỗi gì và nhận được giá trị là undefined. Một số tài liệu trên mạng sẽ giải thích hoisting là đưa tất cả khai báo lên trên đầu file, nhưng giải thích như vậy chưa đúng bản chất của vấn đề. Bởi vì code bạn viết được dịch sang mã máy, nên trong quá trình dich này sẽ xảy ra một số công việc bên trong nó. Chúng ta cùng tìm hiểu thực chất của vấn đề tại sao lại như vậy nhé!
Hoisting là gì?
Với Execution Context sẽ có 2 giai đoạn là Khởi tạo và Thực thi. Trong giai đoạn khởi tạo ta có thể mô phỏng lại những gì Execution Context thực hiện qua hình sau:
Ngoài việc tạo Global Object, this, Outer Environment như đã biết ở bài trước, thì sẽ có thêm công việc cài đặt ( chuẩn bị ) bộ nhớ cho hàm và biến. Tức là Syntax Parser sẽ đọc hết code có trong file và làm công việc này, chứ hoisting không phải là đưa tất cả code khai báo lên đầu file như chúng ta vẫn nghĩ.
Quay lại đoạn code này:
Khi chạy, ngay trước khi chạy từng dòng từ dòng 3, Execution Context đã tạo bộ nhớ cho biến homepage. Nhưng lúc này nó chưa thực hiện phép gán giá trị, do đó nó không biết giá trị của biến này là gì nên nó phải đặt cho một giá trị mặc định là undefined cho homepage. Còn với hàm lúc khai báo thì không có phép gán nên phải khởi tạo luôn phần body của hàm là
console.log('hello')
Sau khi khởi tạo xong thì mới tới giai đoạn là Thực thi chạy từng dòng từ dòng 3 xuống.
Undefined trong Javascript
Chúng ta đã biết là kết quả của đoạn code này là undefined:
var a console.log(a) // undefined
Và undefined là một keyword trong Javascript. Chúng ta có thể kiểu tra một biến là undefined hay không:
if ( a === undefined )
Thậm chí có thể gán một biến bằng với undefined
var a = 5 a = undefined if ( a === undefined )
Tips: Không nên gán giá trị của biến bằng undefined vì sẽkhó debug
Related Posts
Discover more content you might enjoy
English Course Challenge in 2 weeks - Day 12: Kinh nghiệm quay khoá học
Bài viết chia sẻ kinh nghiệm quay khóa học tiếng Anh về Bubble.io, bao gồm việc lựa chọn phần mềm Screen.Studio để quay màn hình và tự động tạo phụ đề, những bài học từ việc đặt mục tiêu và xác định đối tượng học viên trước khi chọn nội dung, cũng như lợi ích của việc thử thách bản thân để vượt qua nỗi sợ và hoàn thành dự định. Tác giả cũng giới thiệu khóa học 'Build your first web app in Bubble for beginners' dành cho người mới bắt đầu.
English Course Challenge in 2 weeks - Day 7: Fine-tuning ChatGPT là gì?
Bài viết chia sẻ tiến trình ngày thứ 7 trong thử thách tạo khóa học tiếng Anh trong 2 tuần. Tác giả giới thiệu về Fine-tuning ChatGPT, một tính năng cho phép tạo phiên bản ChatGPT tùy chỉnh dựa trên dữ liệu cung cấp, đặc biệt hữu ích cho chatbot hỗ trợ khách hàng. Bài viết cũng thảo luận về việc điều chỉnh hướng phát triển ứng dụng demo và khóa học, cùng với những khó khăn khi sử dụng API của OpenAI tại Việt Nam.
English Course Challenge in 2 weeks - Day 2: Tiềm năng của Prompt Engineering
Bài viết chia sẻ về việc phát triển ứng dụng SaaS AI demo cho khóa học Bubble, tập trung vào Prompt Engineering - kỹ thuật viết prompt hiệu quả cho AI. Tác giả giới thiệu cấu trúc prompt chuẩn gồm 6 phần: Persona, Context, Task, Format, Examplar và Tone, đồng thời trình bày ý tưởng và mockup cho ứng dụng hỗ trợ người dùng viết prompt tốt hơn, giải quyết vấn đề nhiều người gặp phải khi sử dụng AI.
Đối thoại với AI: Generative AI (AI tạo sinh) và những điều cần biết
Bài viết dạng hỏi đáp toàn diện về AI tạo sinh, bao gồm kỹ thuật viết prompt hiệu quả, cách kiếm tiền từ AI, các nền tảng thay thế Claude AI, chi phí huấn luyện mô hình lớn, và các khái niệm quan trọng như BERT, mô hình tiền huấn luyện cùng những vấn đề đạo đức liên quan.
Day 18 - Profitable MVP in 30 Days - Hoàn thành ứng dụng
Bài viết ngày 18 của thử thách xây dựng MVP có lợi nhuận, tác giả chia sẻ về việc hoàn thành tiện ích Speed Reading với chi phí $160 sau 3 ngày làm việc với freelancer trên Upwork. Bài viết mô tả quá trình gắn analytics, chỉnh sửa cuối cùng và gửi ứng dụng lên Chrome Web Store để duyệt, đồng thời chia sẻ cảm hứng từ sách 'Start Something That Matters'.
#4 - NoCode MVP - Ý tưởng. Một lần chơi lớn
Chia sẻ về quá trình tìm ý tưởng cho dự án NoCode MVP và giới thiệu ứng dụng quản lý mục tiêu tích hợp nhiều tính năng như sổ tay, thời gian, tài chính.