Ở trước, chúng ta đã giải thích Execution Context là gì. Bất cứ khi nào code chạy trong Javascript, nó được chạy bên trong một Execution Context. Sẽ có nhiều Execution Context nhưng cái lớn nhất, 'leader' của các Execution Context khác được gọi là Global Execution Context.
Global Execution Context sẽ tạo cho bạn 2 thứ là Global Object và biến là this
Để demo, chúng ta sẽ chạy Javascript code
Ok, sau 3 bài, chúng ta cùng bắt đầu viết những dòng code đầu tiên. Bạn chỉ cần tạo một file index.html và một file .js là được
index.html:
Còn file .js bạn đặt tên gì cũng được, sau đó để 2 file cùng chung folder là được Ok, mình xài Visual Studio Code nên chụp màn hình lại cho bạn dễ hình dung:
Bạn lưu code trong file .js rồi mở index.html là xong! Bạn nhớ mở file index.html bằng Google Chrome để xài được Chrome DevTool nhé.
Ok, sau khi mở file index.html lên sẽ có một trang web trắng hiện lên. Bạn nhấn tổ hợp phím Ctrl + Shift + J ( Windows ) hoặc Cmd + Opt + I ( Mac ). Hoặc click phải chuột vào trang web, chọn Inspect
Mở Chrome DevTool
Bạn chọn tab Console để xài Command Line API. Tính năng của cái này nhiều lắm mình không nói hết. Nhưng nó có một tính năng giống như Read–eval–print loop của Python hay Ruby. Tức là gõ code vào cái chạy được luôn, sẽ có 2 trường hợp
Dễ hiểu mà đúng hem?
Quay lại vấn đề của bài hôm nay, như mình đã nói ở trên thì Global Execution Context sẽ tạo cho bạn 2 thứ là Global Object và biến là this. Bạn lưu ý là file app.js của mình vẫn trống trơn, chưa có code gì nha.
Tiếp theo bạn thử gõ this vào và nhấn Enter:
Tiếp theo bạn thử gõ window và nhấn Enter:
Bạn nhận được cùng kết quả
Giải thích: Mặc dù file app.js không có gì nhưng nó vẫn chạy, Syntax Parser sẽ chuyển code sang mã máy, do không có code nên nó bỏ qua và không có lỗi. Tiếp theo Global Execution Context sẽ tạo cho bạn 2 thứ là Global Object là window và biến là this có giá trị bằng với window luôn.
Vì chúng ta đang chạy JS code trên trình duyệt nên global object là window, nhưng nếu chạy ở môi trường khác như NodeJS thì global object sẽ khác. Bạn có thể xem thêm global object của NodeJS tại đây
Oke, bạn đã hiểu sơ sơ rồi đúng không. Bây giờ bạn vào file app.js để viết code của riêng mình nhé.
Lưu lại và ra refresh index.html nhé.
Bạn gõ lại window để lấy global object. Sau đó bạn mở object này ra để xem các name-value pair của object window này.
Như ví dụ trên, bạn thấy là cả biến homepage và hàm hello() đều thuộc global object window.
Vậy global tức là những gì không ở bên trong function
Bạn bắt đầu hình dung được code Javascript chạy được nhờ có Execution Context. Nó tạo thêm cho chúng ta những thứ như global object và this. Ngoài ra còn có Outer Environment - cái này chúng ta sẽ tìm hiểu ở những bài sau.
Bài viết liên quan
[Case Study] - StatcWeb.Studio dùng nocode để làm tool nocode: 200h - 0 sales - 5 min(s) read - published on January 24, 2021[Case Study] Bán No-code MVP làm trong 100h giá $5000 - 11 min(s) read - published on January 15, 2021Chi tiết mình validate idea với nocode - 3 tuần 60 sales - $567 - 7 min(s) read - published on December 15, 2020Do things that don't scale - Lời khuyên tốt nhất để validate idea làm app - 2 min(s) read - published on November 22, 2020GPT-3 sẽ là phát minh quan trọng kể từ Blockchain - 4 min(s) read - published on September 15, 2020#6 - NoCode MVP - Tổng kết - 5 min(s) read - published on August 22, 2020#5 - NoCode MVP - Buông bỏ để hạnh phúc - 2 min(s) read - published on July 28, 2020#4 - NoCode MVP - Ý tưởng. Một lần chơi lớn - 4 min(s) read - published on July 2, 2020#3 - NoCode MVP - Sức mạnh của Bubble.io - 5 min(s) read - published on June 29, 2020#2 - NoCode MVP - Tại sao là NoCode và tương lai của nó - 7 min(s) read - published on June 28, 2020