Học Javascript 7: [ES6] Phân biệt var, let và const

Block scope là gì?

Đây có thể gọi là cái ngáo đá nhất khi mới học Javascript, khi nhìn thấy code trong dấu {  }, ta thường nghĩ là sẽ tạo ra scope mới. Nhưng trong Javascript, chỉ có function mới có thể tạo ra Execution Context mới.

If else, vòng lặp, vv đều không thể thay đổi scope của code được. Kiểu như Javascript nó xem {  } như người vô hình vậy. Bạn có thể xài free-standing blocks như dưới đây được luôn:

Vẫn in ra ‘in block scope’ bình thường.

Khai báo biến với var

Khai báo chồng được luôn:

Mọi người hay nhầm chỗ này:

count = 3 sau khi ra khỏi for

ES6 let và const

Phiên bản ES6 của Javascipt giới thiệu 2 cách khai báo mới là let và const, chúng có những điểm khác biệt sau:

• Không khai báo chồng lên như var được
  
  Swift

  let text = 'niviki.com' var text = 'niviki' // error let text = 'niviki' // error

  1 2 3 4

  let text = 'niviki.com'   var text = 'niviki' // error let text = 'niviki' // error

• let và const gắn với block scope
  
  Swift

  for ( let count = 0; count < 3; count++ ){ } if (true ){ const email = 'khoa@niviki.com' } console.log(count) // count is not defined console.log(email) // email is not defined

  1 2 3 4 5 6 7 8 9 10

  for ( let count = 0; count < 3; count++ ){    }   if (true ){   const email = '[email protected]' }   console.log(count) // count is not defined console.log(email) // email is not defined

• const không thay đổi được giá trị, let thì đổi thoải mái con gà mái:
  
  Swift

  let text = 'niviki.com' const email = 'khoa@niviki.com' text = 'niviki' email = 'admin@niviki.com' // Uncaught TypeError: Assignment to constant variable.

  1 2 3 4 5 6

  let text = 'niviki.com' const email = '[email protected]'     text = 'niviki' email = '[email protected]' // Uncaught TypeError: Assignment to constant variable.

  
   

Cẩn thận với Hoisting

const và let không hoisting như var:

Kết quả sẽ là: text is not defined

Tại sao?

Nếu bạn theo dõi những bài trước thì có thể giải thích dễ dàng rồi. Vì có global execution context nên biến khai báo với var được tạo trong execution context đó. Còn với biến được khai báo với const và let thì không thể.

Var đã chết? Giờ dùng cái nào?

Nếu bạn search ‘should I use var let const in Javascript’ sẽ ra một đống bài, anh hùng khắp nơi cùng tranh luận. Mình thấy có một bài giải thích hay về vấn đề này:

• Mặc định dùng const
• Không nên dùng var trong ES6
• Chỉ dùng let nếu thay đổi giá trị của biến.

Theo anh này cũng đúng vì code React Native cũng theo style này

Nói chung tùy phong cách mỗi người, code miễn sao không bug là được