Tôi có nên sử dụng var trong JavaScript không?

Tất cả chúng ta đều bắt đầu từ đâu đó. Tôi đã học JavaScript khai báo biến với từ khóa

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

8. Nó đơn giản và hiệu quả, nhưng tôi đã thay đổi

Nếu bạn viết mã như

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

9, bạn cần dừng lại. Chà, tôi sẽ thành thật mà nói, bạn không cần phải làm vậy, nhưng bạn nên

Chúng ta thường nghĩ về ngôn ngữ lập trình như một bộ quy tắc khắc trong đá. Thực tế là một ngôn ngữ lập trình - giống như bất kỳ ngôn ngữ nói nào - không ngừng phát triển

Bây giờ tôi sử dụng các từ khóa

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 và

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 để khai báo tất cả các biến của mình trong JavaScript và bạn cũng vậy

Hãy tìm hiểu cách thức và lý do

Khai báo hằng đúng

Một biến, theo tên, xác định một giá trị thay đổi. Mặc dù không nhất thiết có gì sai khi khai báo và không chạm vào một biến, nhưng nếu chúng ta đang cố gắng viết mã có ý nghĩa ngữ nghĩa thì chúng ta nên phân biệt giữa biến và hằng

Hằng đối lập với biến, giá trị đã khai báo không thay đổi. Trong lịch sử, để định nghĩa một hằng số, chúng ta sử dụng tất cả các chữ in hoa, giống như màu sắc tươi sáng trên một con vật độc hại

Thay vì dựa vào quy ước, việc giới thiệu từ khóa

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 cho chúng ta một tùy chọn rõ ràng để khai báo điều không thay đổi

Để sử dụng từ khóa

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0, chỉ cần hoán đổi nó với

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

8 và bây giờ giá trị đó không thể sửa đổi được nữa

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

Việc thực hiện đơn giản, lý do đơn giản. Sử dụng

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 là điều dễ hiểu. Nhưng khi nào điều này là thích hợp?

Các tỷ lệ số như thuế suất hoặc chuyển đổi giữa các đơn vị là những lựa chọn dễ dàng. Một nơi khác bạn sẽ thấy

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 đang được sử dụng là khai báo các hàm bằng cách sử dụng ký hiệu mũi tên

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

Bây giờ chức năng của bạn không thể bị ghi đè

Sửa lỗi Quirky Scope của JavaScript

JavaScript bị thiếu sự rõ ràng về phạm vi thường dẫn đến sự thất vọng khi phát triển và khắc phục sự cố. Dưới đây là tóm tắt về các điểm kỳ lạ trong phạm vi JS

• có thể sử dụng

  // the old way
  // var sales_tax = 0.06;// the new way
  const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

  8 hai lần với một biến [khai báo lại]
• các biến cấp cao nhất là toàn cục theo mặc định [đối tượng toàn cầu]
• các biến có thể được sử dụng trước khi được khai báo [hoisting]
• các biến trong các vòng lặp được sử dụng lại cùng một tham chiếu [bao đóng]

Sử dụng

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 làm rõ và giải quyết nhiều điều kỳ lạ này. Hãy xem xét kỹ hơn

khai báo lại

Cái này đơn giản, bạn không thể khai báo lại một biến đã được tạo bằng

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0

var x = 0;
let y = 0;var x = 1;
let y = 1; // "SyntaxError: Identifier 'y' has already been declared

đối tượng toàn cầu

Ở cấp cao nhất, các biến được khai báo bằng

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

8 được thêm vào đối tượng toàn cầu dưới dạng thuộc tính trong khi các biến

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 thì không

var x = 0;
let y = 0;console.log[window.x]; // 0
console.log[window.y]; // undefined

cẩu

Các biến được xác định bằng

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 chỉ có thể truy cập được trong phạm vi khối của chúng trong khi các biến

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

8 được nâng lên cấp hàm

// Using var
console.log[i];  // undefined
for[var i=0; i {
  // Do stuff
}myFunction[1,2]

0, một tham chiếu mới được tạo mỗi lần

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

2

Cuối cùng, ngay cả khi bạn không hiểu 100% về những lý do này và lý do tại sao chúng hoạt động theo cách chúng làm, thì việc chuyển sang

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 sẽ dẫn đến mã rõ ràng hơn, hoạt động nhất quán và sẽ dễ dàng khắc phục sự cố/bảo trì hơn

Một lời cảnh báo

Mặc dù

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 và

const myFunction = [x,y] => {
  // Do stuff
}myFunction[1,2]

0 sẽ thay thế hiệu quả cho từ khóa

// the old way
// var sales_tax = 0.06;// the new way
const sales_tax = 0.06;sales_tax = 0.08; // "TypeError: Assignment to constant variable.

8, nhưng cuộc sống không phải lúc nào cũng đơn giản như vậy. Vì những từ khóa này đã được giới thiệu trong ECMAScript 2015 [ES6], nếu nền tảng bạn làm việc không cho phép nó thì bạn không gặp may. Ngoài ra, bạn sẽ muốn đảm bảo rằng bạn thực hiện các bước để đảm bảo mã của bạn hoạt động trên các trình duyệt của đối tượng mục tiêu của bạn

Bạn vẫn thấy mình đang sử dụng

var x = 0;
let y = 0;var x = 1;
let y = 1; // "SyntaxError: Identifier 'y' has already been declared

9 chứ?