Giải thích 3 khái niệm khó trong Javascript cho phụ huynh
Closures Closures trong JS không dễ để hiểu nhưng nó lại thường xuyên được hỏi trong các buổi phỏng vấn. Thường được gọi Lexical scoping hay Static scoping, closures là một cơ chế trừu tượng cho phép bạn chia cắt các mối quan ngại một cách gọn gàng. Một closure ...
Closures
Closures trong JS không dễ để hiểu nhưng nó lại thường xuyên được hỏi trong các buổi phỏng vấn.
Thường được gọi Lexical scoping hay Static scoping, closures là một cơ chế trừu tượng cho phép bạn chia cắt các mối quan ngại một cách gọn gàng.
Một closure là một hàm bên trong có quyền truy cập vào các biến của hàm bên ngoài – scope chain.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
function foo() { var a = 2; function log() { console.log("a: " + a); } return log; } var a = 3; var bar = foo(); bar(); console.log('Global a: '+ a); |
Kết quả sẽ là:
“a: 2”
“Global a: 3”
Callbacks
Callback là một hàm được chuyển tới hàm khác làm tham số để chờ được gọi để thực thi nhiệm vụ. Hàm được truyền này sẽ được call (hoặc được executed) trong một hàm khác.
|
1 2 3 4 5 6 7 8 9 10 11 |
function executor (callback){ if(callback){ console.log('Result after calling your function ' + callback()) } else{ console.error('No callback received') } } executor( () => (1 + 1) ) |
Một ví dụ đơn giản là:
Chúng ta có một hàm gọi là executor, nó sẽ thực hiện mọi thứ như tham số
Chúng ta call executor bằng cách chuyển một hàm làm tham số
Kết quả sẽ là: “Result after calling your function 2”
Promises
Promise đại diện cho kết quả cuối cùng của một operation không đồng bộ (asynchronous operation).
Declaring một promise
Promise có thể thuộc một trong 3 trạng thái sau:
Pending→ kết quả của promise vẫn chưa được xác định, bởi vì operation không đồng bộ sẽ tạo ra kết quả của nó chưa hoàn thành.
Fulfilled → operation không đồng bộ đã hoàn thành và promise có giá trị.
Rejected → operation không đồng bộ bị fail, và promise sẽ không bao giờ được đáp ứng. Trong trạng thái bị rejected, promise sẽ có đưa ra lý do cho biết tại sao operation failed.
|
1 2 3 4 5 6 7 8 9 10 |
var p = new Promise( (resolve, reject) => { if (/* condition */) { resolve(/* value */); // fulfilled successfully } else { reject(/* reason */); // error, rejected } }); |
Tiêu thụ một promise
API chính cho một promise là phương thức then của nó, vốn đăng ký callback để nhận giá trị cuối cùng hoặc lý do tại sao promise không thể được thực hiện.
|
1 2 3 4 |
var prom = new Promise((resolve, reject) => resolve(5)); prom.then((val) => console.log(val)); // 5 |
Chúng ta cũng có thể kiểm tra bất kỳ lỗi nào trong quá trình execute promise:
|
1 2 3 4 5 6 |
var prom = new Promise((resolve, reject) => resolve(5)); prom .then((val) => console.log(val)) .catch((err) => console.error(err)) |
Techtalk via Dev.to
