Understand JavaScript - Function Statements and Function Expressions
Trong bài trước mình có giới thiệu rằng trong JS các hàm là các đối tượng và bạn có thể thấy khái niệm này mở ra những điều thực sự thú vị và mạnh mẽ , khái niệm về FirstClassFunction để hiểu sâu hơn về Function hôm nay mình sẽ giới thiệu cho các bạn về sự khác biệt khi bạn sử dụng Function Statement và Function Expression.
Expression : là tập hợp của một hay nhiều đoạn mã và nó cho ra kết quả là một giá trị và giá trị này không nhất thiết phải lưu trong một biến , khi chúng ta nói đến một Statement thì đơn giản statement chỉ làm việc hay thực thi nó KHÔNG tạo ra một giá trị nào cả. còn Expression sẽ tạo ra hay trả về một giá trị.
Trong JS vì các hàm là các đối tượng chúng ta có thể tạo ra 2 kiểu hàm Function Statement và Function Expression .
(Hình 1.1)
Ở bài trước mình đã nói rằng trong JS , function là object như vậy ở dòng code trên mình đã tạo ra một hàm gồm đầy đủ các thuộc tính như name hay code , nhưng bạn có thể thấy trong giai đoạn Code Execution không có bất kì thứ gì được tạo ra , bạn hãy chú ý chi tiết này vì nó thể hiện sự khác biệt giữa function expresion và function statement.
Bạn hãy nhớ lại rằng khi một hàm Statement được khai báo , định nghĩa rồi thực thi ,
Trong EC ở giai đoạn Create Phase nó sẽ được đặt vào trong bộ nhớ những Property của nó
- Name
- Code
Và khi mình gọi nó bằng dấu () thì dấu () như một mệnh lệnh cho JSE kết nối đến vùng nhớ lưu trữ Property Code rồi nó sẽ thực thi hàm , chạy từng dòng.
Thế còn Function Expression thì sao ??
(Hình 1.2)
Trong trường hợp này mình có một toán tử "=" rõ ràng mình đã tạo ra một Object (hàm) và gán nó bằng một biến và trong giai đoạn Code Exection , biến này được đẩy vào trong Variable Environment => Mình đã khởi tạo một biến.
=> biến anonymousGreet tham chiếu đến địa chỉ của vùng nhớ chứa Property Object giống như bạn có địa chỉ nhà nơi bạn sống chẳng hạn , địa chỉ này cho phép người khác biết bạn ở đâu.
Như vậy ở trong FunctionExpression JSE vẫn tạo ra một Object trong bộ nhớ nhưng thay vì đó Property Name của Object (Function) này bị trống vì mình không khai báo Name cho nó vì mình đã có một biến tham chiếu đến vùng nhớ chứa đối tượng , nói cách khác thì đây chính là một Anonymous Function (hàm không có tên trong Property Name của nó) thay vào đó bạn tạo ra một biến tham chiếu đến vùng nhớ chứa đối tượng đó.
- Tất nhiên chúng ta cũng có Property Code chứa toàn bộ code nằm trong hàm.
- Để thực thi nó chúng ta chỉ cần dùng biến tham chiếu và khai báo () đằng sau.
Toàn bộ những dòng code hình 1.2 trên chính là một Expression bởi vì kết quả của nó là một giá trị.
Còn ở trong hình 1.1 chúng ta có một Function Statement bởi vì khi code được thực thi mặc dù Funtion đã được nhét vào trong bộ nhớ khi phần này chạy qua trong giai đoạn Execution Phase nó không thực sự làm gì cả , nó chỉ hiểu rằng đây là hàm và thực thi qua từng dòng code.
Ở trong hình 1.2 hàm đó dẫn đến một Object được tạo ra , đơn giản là nó trả về một đối tượng cơ bản , không có biến nào được đặt vào trong Variable Envỉonment.
Expression : là tập hợp của một hay nhiều đoạn mã và nó cho ra kết quả là một giá trị và giá trị này không nhất thiết phải lưu trong một biến , khi chúng ta nói đến một Statement thì đơn giản statement chỉ làm việc hay thực thi nó KHÔNG tạo ra một giá trị nào cả. còn Expression sẽ tạo ra hay trả về một giá trị.
Trong JS vì các hàm là các đối tượng chúng ta có thể tạo ra 2 kiểu hàm Function Statement và Function Expression .
Ở bài trước mình đã nói rằng trong JS , function là object như vậy ở dòng code trên mình đã tạo ra một hàm gồm đầy đủ các thuộc tính như name hay code , nhưng bạn có thể thấy trong giai đoạn Code Execution không có bất kì thứ gì được tạo ra , bạn hãy chú ý chi tiết này vì nó thể hiện sự khác biệt giữa function expresion và function statement.
Bạn hãy nhớ lại rằng khi một hàm Statement được khai báo , định nghĩa rồi thực thi ,
Trong EC ở giai đoạn Create Phase nó sẽ được đặt vào trong bộ nhớ những Property của nó
- Name
- Code
Và khi mình gọi nó bằng dấu () thì dấu () như một mệnh lệnh cho JSE kết nối đến vùng nhớ lưu trữ Property Code rồi nó sẽ thực thi hàm , chạy từng dòng.
Thế còn Function Expression thì sao ??
(Hình 1.2)
Trong trường hợp này mình có một toán tử "=" rõ ràng mình đã tạo ra một Object (hàm) và gán nó bằng một biến và trong giai đoạn Code Exection , biến này được đẩy vào trong Variable Environment => Mình đã khởi tạo một biến.
=> biến anonymousGreet tham chiếu đến địa chỉ của vùng nhớ chứa Property Object giống như bạn có địa chỉ nhà nơi bạn sống chẳng hạn , địa chỉ này cho phép người khác biết bạn ở đâu.
Như vậy ở trong FunctionExpression JSE vẫn tạo ra một Object trong bộ nhớ nhưng thay vì đó Property Name của Object (Function) này bị trống vì mình không khai báo Name cho nó vì mình đã có một biến tham chiếu đến vùng nhớ chứa đối tượng , nói cách khác thì đây chính là một Anonymous Function (hàm không có tên trong Property Name của nó) thay vào đó bạn tạo ra một biến tham chiếu đến vùng nhớ chứa đối tượng đó.
- Tất nhiên chúng ta cũng có Property Code chứa toàn bộ code nằm trong hàm.
- Để thực thi nó chúng ta chỉ cần dùng biến tham chiếu và khai báo () đằng sau.
Toàn bộ những dòng code hình 1.2 trên chính là một Expression bởi vì kết quả của nó là một giá trị.
Còn ở trong hình 1.1 chúng ta có một Function Statement bởi vì khi code được thực thi mặc dù Funtion đã được nhét vào trong bộ nhớ khi phần này chạy qua trong giai đoạn Execution Phase nó không thực sự làm gì cả , nó chỉ hiểu rằng đây là hàm và thực thi qua từng dòng code.
Ở trong hình 1.2 hàm đó dẫn đến một Object được tạo ra , đơn giản là nó trả về một đối tượng cơ bản , không có biến nào được đặt vào trong Variable Envỉonment.
Nhận xét
Đăng nhận xét