Bài này chúng ta sẽ đi sâu hơn về Scope và cơ chế Hoisting của Javascript. Đây là bài phân tích chuyên sâu Scope, Hoisting và cách dùng var, let, const.

Tiếp nối bài Chinh phục HOF, Clorsures, Currying trong Javascript thì trong bài này chúng ta sẽ tìm hiểu về Scope và cơ chế Hoisting nổi tiếng trong Javascript. Cảnh báo trước là bài khá dài đấy, các bác thắt dây an toàn và lên đường nào.

1. Scope là gì

Scope là phạm vi cho phép truy cập của biến. Javascript hiện nay có 3 loại Scope đó là Global Scope, Function Scope, Block Scope.

Global Scope

Biến được khai báo global (bên ngoài bất cứ function nào) thì có Global Scope

var company = "xdevclass";
// Code tại đây có thể xử dụng biến company
function myFunction() {
  // Code tại đây cũng có thể xử dụng biến company
}

Biến global có thể được truy cập từ bất cứ đâu trong chương trình Javascript

Function Scope

// Code ở đây không thể sử dụng biến carName
function myFunction() {
  var carName = "Volvo";
  // code ở đây CÓ THỂ sử dụng biến carName
}
// Code ở đây không thể sử dụng biến carName

Biến được khai báo cục bộ (bên trong một function) thì có Function Scope

Block Scope

Biến được khai báo với var không thể có Block Scope. Vì thế biến được khai báo trên trong block { } có thể được truy cập từ bên ngoài block

{
  var x = 2;
}
// x CÓ THỂ được dùng tại đây

Trước ES2015 (ES6) Javascript không có Block Scope.

Từ ES6 trở đi biến được khai báo bằng let và const có Block Scope. Vì thế các biến bên ngoài block { } không thể được truy cập bên ngoài block

{
  let x = 2;
}
// x KHÔNG THỂ truy cập tại đây

#javascript #web-development #developer