Hãy so với var trong JavaScript

Như chúng ta đã biết để khai báo một biến trong javascript chúng ta có 2 lựa chọn là khai báo bằng var hoặc khai báo bằng let. Bây giờ câu hỏi là khi nào thì sử dụng var và khi nào thì sử dụng let i. e sự khác biệt chính giữa cả hai là gì

Trong văn bản sau đây, chúng ta biết được sự khác biệt chính giữa var và let trong javascript

Sự khác biệt chính giữa let và var là phạm vi của một biến được xác định bằng let được giới hạn trong khối mà nó được khai báo trong khi biến được khai báo bằng var có phạm vi toàn cục. Vì vậy, chúng ta có thể nói rằng var đúng hơn là một từ khóa xác định một biến trên toàn cầu bất kể phạm vi khối

Phạm vi của let không chỉ giới hạn trong khối mà nó được xác định mà biến let cũng không được thêm vào với đối tượng cửa sổ toàn cục ngay cả khi nó được khai báo bên ngoài bất kỳ khối nào. Nhưng chúng ta có thể truy cập biến với var từ đối tượng cửa sổ nếu nó được định nghĩa trên toàn cầu

Do phạm vi giới hạn, biến let thường được sử dụng khi có giới hạn sử dụng các biến đó như trong vòng lặp for, vòng lặp while hoặc trong phạm vi của điều kiện if, v.v. trong khi biến var được sử dụng khi giá trị của biến ít cần thay đổi và được sử dụng để

Ngoài ra, một điểm khác biệt giữa var và let là biến với var có thể được khai báo lại thành một số giá trị khác trong khi biến không thể được khai báo lại nếu nó được xác định bằng let

Tóm lược. trong hướng dẫn này, bạn sẽ tìm hiểu về sự khác biệt giữa từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2 và

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3

#1. phạm vi biến

Các biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2 thuộc về phạm vi toàn cầu khi bạn xác định chúng bên ngoài một hàm. Ví dụ

var counter;
Code language: JavaScript (javascript)

Trong ví dụ này,

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

5 là một biến toàn cục. Điều đó có nghĩa là biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

5 có thể được truy cập bởi bất kỳ chức năng nào

Khi bạn khai báo một biến bên trong một hàm bằng cách sử dụng từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2, phạm vi của biến là cục bộ. Ví dụ

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

Trong ví dụ này, biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here



Code language: JavaScript (javascript)

5 là cục bộ của hàm

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

9. Nó không thể truy cập được bên ngoài chức năng

Ví dụ sau hiển thị bốn số từ 0 đến 4 bên trong vòng lặp và số 5 bên ngoài vòng lặp

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

đầu ra

Inside the loop: 0 
Inside the loop: 1 
Inside the loop: 2 
Inside the loop: 3 
Inside the loop: 4 
Outside the loop: 5
Code language: Shell Session (shell)

Trong ví dụ này, biến

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

0 là biến toàn cục. Do đó, nó có thể được truy cập từ cả bên trong và sau vòng lặp

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

1

Ví dụ sau sử dụng từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3 thay vì từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2

for (let i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

Trong trường hợp này, mã hiển thị bốn số từ 0 đến 4 bên trong một vòng lặp và lỗi tham chiếu

Inside the loop: 0
Inside the loop: 1
Inside the loop: 2
Inside the loop: 3
Inside the loop: 4

Lỗi

Uncaught ReferenceError: i is not defined
Code language: JavaScript (javascript)

Vì ví dụ này sử dụng từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3 nên biến

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);



Code language: JavaScript (javascript)

0 bị chặn phạm vi. Điều đó có nghĩa là biến

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

0 chỉ tồn tại và có thể truy cập được bên trong khối vòng lặp

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

7

Trong JavaScript, một khối được phân định bằng một cặp dấu ngoặc nhọn

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

8 giống như trong các câu lệnh

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

9 và

for (var i = 0; i < 5; i++) {
	console.log("Inside the loop:", i);
}

console.log("Outside the loop:", i);
Code language: JavaScript (javascript)

7

if(condition) {
   // inside a block
}

for(...) {
  // inside a block
}
Code language: JavaScript (javascript)

#2. Tạo thuộc tính toàn cầu

Các biến toàn cầu

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2 được thêm vào đối tượng toàn cầu dưới dạng các thuộc tính. Đối tượng toàn cầu là

Inside the loop: 0 
Inside the loop: 1 
Inside the loop: 2 
Inside the loop: 3 
Inside the loop: 4 
Outside the loop: 5
Code language: Shell Session (shell)

2 trên trình duyệt web và

Inside the loop: 0 
Inside the loop: 1 
Inside the loop: 2 
Inside the loop: 3 
Inside the loop: 4 
Outside the loop: 5
Code language: Shell Session (shell)

3 trên Node. js

var counter = 0;
console.log(window.counter); //  0
Code language: JavaScript (javascript)

Tuy nhiên, các biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3 không được thêm vào đối tượng toàn cầu

let counter = 0;
console.log(window.counter); // undefined
Code language: JavaScript (javascript)

#3. khai báo lại

Từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2 cho phép bạn khai báo lại một biến mà không gặp vấn đề gì

function increase() {
    var counter = 10;
}
// cannot access the counter variable here



Code language: JavaScript (javascript)

0

Tuy nhiên, nếu bạn khai báo lại một biến với từ khóa

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3, bạn sẽ gặp lỗi

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

1

#4. Vùng chết tạm thời

Biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3 có vùng chết tạm thời trong khi biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2 thì không. Để hiểu vùng chết tạm thời, hãy xem xét vòng đời của cả hai biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

2 và

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3, có hai bước. sáng tạo và thực hiện

Các biến var

• Trong giai đoạn tạo, công cụ JavaScript chỉ định không gian lưu trữ cho các biến

  function increase() {
      var counter = 10;
  }
  // cannot access the counter variable here
  Code language: JavaScript (javascript)

  2 và ngay lập tức khởi tạo chúng thành

  for (let i = 0; i < 5; i++) {
  	console.log("Inside the loop:", i);
  }
  
  console.log("Outside the loop:", i);
  Code language: JavaScript (javascript)

  2
• Trong giai đoạn thực thi, công cụ JavaScript gán các biến

  function increase() {
      var counter = 10;
  }
  // cannot access the counter variable here
  Code language: JavaScript (javascript)

  2 các giá trị được chỉ định bởi các phép gán nếu có. Mặt khác, các biến

  function increase() {
      var counter = 10;
  }
  // cannot access the counter variable here
  Code language: JavaScript (javascript)

  2 vẫn chưa được xác định

Xem ngữ cảnh thực thi để biết thêm thông tin

Các biến let

• Trong giai đoạn tạo, công cụ JavaScript chỉ định không gian lưu trữ cho biến

  function increase() {
      var counter = 10;
  }
  // cannot access the counter variable here
  Code language: JavaScript (javascript)

  3 nhưng không khởi tạo biến. Tham chiếu các biến chưa được khởi tạo sẽ gây ra lỗi

  for (let i = 0; i < 5; i++) {
  	console.log("Inside the loop:", i);
  }
  
  console.log("Outside the loop:", i);
  Code language: JavaScript (javascript)

  6
• Các biến

  function increase() {
      var counter = 10;
  }
  // cannot access the counter variable here
  Code language: JavaScript (javascript)

  3 có giai đoạn thực hiện giống như các biến

  function increase() {
      var counter = 10;
  }
  // cannot access the counter variable here
  Code language: JavaScript (javascript)

  2

Vùng chết tạm thời bắt đầu từ khối cho đến khi khai báo biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3 được xử lý. Nói cách khác, đó là vị trí mà bạn không thể truy cập các biến

function increase() {
    var counter = 10;
}
// cannot access the counter variable here
Code language: JavaScript (javascript)

3 trước khi chúng được xác định

Sự khác biệt giữa VAR và let Javascript là gì?

Chúng ta có nên sử dụng let hoặc VAR trong Javascript không?

Tại sao let tốt hơn VAR trong Javascript?

Let có tốt hơn VAR không?