Việc sử dụng let và const trong javascript là gì?

ES2015 (hoặc ES6) đã giới thiệu hai cách mới để tạo biến,

var declaration
 Nội dung chính Show
 
Trước khi bạn đi
Tại sao chúng ta cần let và const trong JavaScript?
Việc sử dụng const trong JavaScript là gì?
Sự khác biệt giữa let Var và const trong JavaScript là gì?
 

console.log(declaration) // undefined

9 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0. Nhưng trước khi chúng ta thực sự đi sâu vào sự khác biệt giữa

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1,

var declaration

console.log(declaration) // undefined

9 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0, có một số điều kiện tiên quyết bạn cần biết trước. Chúng là khai báo biến so với khởi tạo, phạm vi (cụ thể là phạm vi chức năng) và cẩu

Khai báo biến so với khởi tạo

Một khai báo biến giới thiệu một định danh mới

var declaration

Ở trên, chúng tôi tạo một định danh mới được gọi là khai báo. Trong JavaScript, các biến được khởi tạo với giá trị

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4 khi chúng được tạo. Điều đó có nghĩa là nếu chúng ta cố ghi nhật ký biến

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

5, chúng ta sẽ nhận được

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4

var declaration

console.log(declaration) // undefined

Vì vậy, nếu chúng ta đăng nhập biến khai báo, chúng ta sẽ không xác định được

Khác với khai báo biến, khởi tạo biến là khi bạn gán giá trị cho biến lần đầu tiên

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

Vì vậy, ở đây chúng tôi đang khởi tạo biến

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

5 bằng cách gán nó cho một chuỗi

Điều này dẫn chúng ta đến khái niệm thứ hai, Phạm vi

Phạm vi

Phạm vi xác định nơi có thể truy cập các biến và hàm bên trong chương trình của bạn. Trong JavaScript, có hai loại phạm vi - phạm vi toàn cục và phạm vi chức năng. Theo thông số kỹ thuật chính thức,

"Nếu câu lệnh biến xuất hiện bên trong Khai báo hàm, thì các biến được xác định với phạm vi hàm-cục bộ trong hàm đó. "

Điều đó có nghĩa là nếu bạn tạo một biến với

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1, thì biến đó được "phạm vi" với hàm mà nó được tạo và chỉ có thể truy cập được bên trong hàm đó hoặc, bất kỳ hàm lồng nhau nào

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

3

Ở trên, chúng tôi cố gắng truy cập một biến bên ngoài hàm mà nó đã được khai báo. Bởi vì

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

9 là "phạm vi" của hàm

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

30, nên nó chỉ có thể truy cập được bên trong chính

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

31 hoặc bất kỳ hàm lồng nhau nào bên trong

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

31 (như bên dưới)

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

8

Bây giờ hãy xem một ví dụ nâng cao hơn. Giả sử chúng ta có một mảng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

33 và chúng ta cần một hàm nhận vào mảng đó cũng như một

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

34 và trả về cho chúng ta một mảng giá chiết khấu mới. Mục tiêu cuối cùng có thể trông giống như thế này

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1

Và việc thực hiện có thể trông giống như thế này

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

2

Có vẻ đủ đơn giản nhưng điều này có liên quan gì đến phạm vi khối? . Các biến được khai báo bên trong nó có thể truy cập được bên ngoài nó không?

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4

Nếu JavaScript là ngôn ngữ lập trình duy nhất bạn biết, bạn có thể không nghĩ gì về điều này. Tuy nhiên, nếu bạn đến với JavaScript từ một ngôn ngữ lập trình khác, cụ thể là ngôn ngữ lập trình bị chặn phạm vi, thì có lẽ bạn hơi lo lắng về những gì đang diễn ra ở đây. Nó không thực sự bị hỏng, nó chỉ là một loại kỳ lạ. Thực sự không có lý do gì để vẫn có quyền truy cập vào

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

36,

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

37 và

var declaration




console.log(declaration) // undefined

declaration = 'This is an initialization'

38 bên ngoài vòng lặp

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

35. Nó không thực sự mang lại lợi ích gì cho chúng ta và thậm chí nó có thể gây hại cho chúng ta trong một số trường hợp. Tuy nhiên, vì các biến được khai báo với

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 nằm trong phạm vi hàm, nên bạn phải

Bây giờ chúng ta đã thảo luận về khai báo biến, khởi tạo và phạm vi, điều cuối cùng chúng ta cần làm trước khi đi sâu vào

var declaration

console.log(declaration) // undefined

9 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 là cẩu

cẩu

Hãy nhớ trước đó chúng tôi đã nói rằng "Trong JavaScript, các biến được khởi tạo với giá trị là

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4 khi chúng được tạo. ". Hóa ra, đó là tất cả những gì "Hoisting" là. Trình thông dịch JavaScript sẽ gán cho các khai báo biến một giá trị mặc định là

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4 trong giai đoạn được gọi là giai đoạn "Sáng tạo"

Để có hướng dẫn chi tiết hơn về Giai đoạn tạo, cẩu và phạm vi, hãy xem "Hướng dẫn cơ bản về cẩu, phạm vi và đóng trong JavaScript"

Hãy xem ví dụ trước và xem cách cẩu ảnh hưởng đến nó

var declaration

console.log(declaration) // undefined

4

Lưu ý rằng tất cả các khai báo biến đều được gán giá trị mặc định là

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4. Đó là lý do tại sao nếu bạn thử truy cập một trong các biến đó trước khi nó thực sự được khai báo, bạn sẽ chỉ nhận được

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4

var declaration

console.log(declaration) // undefined

7

Bây giờ bạn đã biết mọi thứ cần biết về

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1, cuối cùng hãy nói về toàn bộ lý do tại sao bạn ở đây, sự khác biệt giữa

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1,

var declaration

console.log(declaration) // undefined

9 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 là gì?

var VS hãy để VS const

Đầu tiên, hãy so sánh

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 và

var declaration

console.log(declaration) // undefined

9. Sự khác biệt chính giữa

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 và

var declaration

console.log(declaration) // undefined

9 là thay vì nằm trong phạm vi chức năng,

var declaration

console.log(declaration) // undefined

9 là phạm vi khối. Điều đó có nghĩa là một biến được tạo bằng từ khóa

var declaration

console.log(declaration) // undefined

9 có sẵn bên trong "khối" mà nó được tạo cũng như bất kỳ khối lồng nhau nào. Khi tôi nói "khối", ý tôi là bất cứ thứ gì được bao quanh bởi dấu ngoặc nhọn

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

17 như trong vòng lặp

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

35 hoặc câu lệnh

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

19

Vì vậy, hãy nhìn lại hàm

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

20 của chúng ta lần cuối

var declaration

console.log(declaration) // undefined

0

Hãy nhớ rằng chúng ta có thể ghi nhật ký

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

36,

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

37 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

38 bên ngoài vòng lặp

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

35 vì chúng được khai báo với

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 nằm trong phạm vi chức năng. Nhưng bây giờ, điều gì sẽ xảy ra nếu chúng ta thay đổi khai báo _______ 11 để sử dụng

var declaration

console.log(declaration) // undefined

9 và thử chạy nó?

var declaration

console.log(declaration) // undefined

1

🙅‍♀️ Chúng tôi nhận được

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

29. Điều này cho chúng ta biết rằng các biến được khai báo với

var declaration

console.log(declaration) // undefined

9 là phạm vi khối, không phải phạm vi chức năng. Vì vậy, cố gắng truy cập vào

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

36 (hoặc

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

37 hoặc

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

38) bên ngoài "khối" mà chúng được khai báo sẽ mang lại cho chúng tôi một lỗi tham chiếu như chúng tôi vừa mới thấy

var declaration

console.log(declaration) // undefined

2

Sự khác biệt tiếp theo phải làm với Palăng. Trước đó, chúng tôi đã nói rằng định nghĩa của hoisting là "Trình thông dịch JavaScript sẽ gán cho các khai báo biến một giá trị mặc định là

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4 trong giai đoạn được gọi là 'Tạo'. " Chúng tôi thậm chí đã thấy điều này trong thực tế bằng cách ghi nhật ký một biến trước khi nó được khai báo (bạn nhận được

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4)

var declaration

console.log(declaration) // undefined

7

Tôi không thể nghĩ ra bất kỳ trường hợp sử dụng nào mà bạn thực sự muốn truy cập vào một biến trước khi nó được khai báo. Có vẻ như ném ReferenceError sẽ là một mặc định tốt hơn là trả lại

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4. Trên thực tế, đây chính xác là những gì

var declaration

console.log(declaration) // undefined

9 làm. Nếu bạn cố gắng truy cập một biến được khai báo bằng

var declaration

console.log(declaration) // undefined

9 trước khi nó được khai báo, thay vì nhận được

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4 (như với những biến được khai báo bằng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1), bạn sẽ nhận được ReferenceError

var declaration

console.log(declaration) // undefined

4

var declaration

console.log(declaration) // undefined

5

hãy để VS const

Bây giờ bạn đã hiểu sự khác biệt giữa

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 và

var declaration

console.log(declaration) // undefined

9, vậy còn

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 thì sao? . Tuy nhiên, điểm khác biệt duy nhất là khi bạn đã gán giá trị cho một biến bằng cách sử dụng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0, bạn không thể gán lại giá trị đó cho một giá trị mới

var declaration

console.log(declaration) // undefined

6

Điều rút ra ở trên là các biến được khai báo bằng

var declaration

console.log(declaration) // undefined

9 có thể được gán lại, nhưng các biến được khai báo bằng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 thì không thể

Thật tuyệt, vì vậy bất cứ khi nào bạn muốn một biến là bất biến, bạn có thể khai báo nó bằng _____10. Chà, không hẳn. Chỉ vì một biến được khai báo với

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 không có nghĩa là biến đó là bất biến, tất cả những gì có nghĩa là giá trị không thể được gán lại. Đây là một ví dụ tốt

var declaration

console.log(declaration) // undefined

7

Lưu ý rằng việc thay đổi một thuộc tính trên một đối tượng không có nghĩa là gán lại nó, vì vậy mặc dù một đối tượng được khai báo bằng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0, nhưng điều đó không có nghĩa là bạn không thể thay đổi bất kỳ thuộc tính nào của nó. Nó chỉ có nghĩa là bạn không thể gán lại nó cho một giá trị mới

---

Bây giờ, câu hỏi quan trọng nhất mà chúng tôi chưa trả lời, bạn nên sử dụng

var declaration

console.log(declaration) // undefined




declaration = 'This is an initialization'

1,

var declaration

console.log(declaration) // undefined

9 hay

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0? . Lý do cho điều này là bằng cách sử dụng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0, bạn đang báo hiệu cho chính mình trong tương lai cũng như bất kỳ nhà phát triển tương lai nào khác phải đọc mã của bạn rằng biến này không nên thay đổi. Nếu nó cần thay đổi (như trong vòng lặp

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

35), bạn nên sử dụng

var declaration

console.log(declaration) // undefined

9

Vì vậy, giữa các biến thay đổi và các biến không thay đổi, không còn nhiều. Điều đó có nghĩa là bạn không bao giờ phải sử dụng lại

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1

Bây giờ, ý kiến ​​không phổ biến, mặc dù nó vẫn có một số giá trị đối với nó, là bạn không bao giờ nên sử dụng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 bởi vì mặc dù bạn đang cố gắng báo hiệu rằng biến đó là bất biến, nhưng như chúng ta đã thấy ở trên, điều đó không hoàn toàn đúng. Các nhà phát triển đăng ký ý kiến ​​này luôn sử dụng

var declaration

console.log(declaration) // undefined

9 trừ khi họ có các biến thực sự là hằng số như

var declaration

console.log(declaration) // undefined

02

Vì vậy, để tóm tắt lại,

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 là phạm vi chức năng và nếu bạn cố gắng sử dụng một biến được khai báo bằng

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

1 trước khi khai báo thực tế, bạn sẽ chỉ nhận được

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

4.

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 và

var declaration

console.log(declaration) // undefined

9 bị chặn trong phạm vi và nếu bạn cố gắng sử dụng biến được khai báo bằng

var declaration

console.log(declaration) // undefined

9 hoặc

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 trước khi khai báo, bạn sẽ nhận được ReferenceError. Cuối cùng, sự khác biệt giữa

var declaration

console.log(declaration) // undefined

9 và

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0 là một khi bạn đã gán giá trị cho

var declaration

console.log(declaration) // undefined

declaration = 'This is an initialization'

0, bạn không thể gán lại giá trị đó, nhưng với

var declaration

console.log(declaration) // undefined

9, bạn có thể

var declaration

console.log(declaration) // undefined

8

---

Trước khi bạn đi

Tôi biết, một bản tin khác - nhưng hãy nghe tôi nói. Hầu hết các bản tin JavaScript đều tệ. Lần cuối cùng bạn thực sự mong muốn có được một cái là khi nào?

Chúng tôi gọi nó là Byte, nhưng những người khác gọi nó là bản tin yêu thích của họ

tham gia byte

Được gửi tới 114.218 nhà phát triển vào mỗi thứ Hai và thứ Năm

Sdu

@sduduzo_g

Đây là bản tin đầu tiên mà tôi mở danh sách phát nhạc và tối đa hóa cửa sổ trình duyệt của mình chỉ để yên tâm đọc nó. Kudos để @uidotdev cho nội dung hàng tuần tuyệt vời



Brandon Bayer

@flybayer

Bản tin Bytes là một tác phẩm nghệ thuật. Đó là bản tin dành cho nhà phát triển duy nhất mà tôi đã đăng ký. Bằng cách nào đó, họ lấy những thứ hơi nhàm chán và truyền vào đó một lượng hài vừa phải để khiến bạn cười khúc khích



John Hawley

@johnhawly

Bytes là bản tin yêu thích của tôi kể từ khi thành lập. Đó là điều yêu thích của tôi mà tôi mong đợi vào thứ Hai. Tuyệt vời với một tách cà phê nóng



màu xanh lá cây Garrett

@garrettgreen

Tôi đăng ký RẤT NHIỀU bản tin dành cho nhà phát triển (đặc biệt là JS/TS/Node) và Byte của @uidotdev luôn là một sự thay đổi thú vị, được hoan nghênh đối với hầu hết (hài hước, vui vẻ, v.v.) nhưng vẫn toàn diện/hữu ích



Muhammad

@mhashim6_

Thực sự là bản tin duy nhất mà tôi chờ đợi mỗi tuần



Grayson Hicks

@graysonhicks

Bytes là bản tin dành cho nhà phát triển mà tôi mong chờ nhất mỗi tuần. Cân bằng tuyệt vời giữa nội dung và ngữ cảnh. Cảm ơn @uidotdev



Mitchell Wright

@mitchellbwright

Tôi biết tôi đã nói điều đó trước đây, nhưng @tylermcginnis không bỏ lỡ email Bytes. Nếu bạn là nhà phát triển, bạn thực sự cần phải đăng ký



Ali Spittel

@aspittel

Tôi có thể nói rằng tôi cười khúc khích mỗi khi nhận được email @uidotdev mỗi tuần không?



Chris Finn

@thefinnomenon

Mọi lập trình viên JavaScript nên đăng ký nhận bản tin từ @uidotdev. Họ không chỉ quản lý để đưa tin ngắn gọn về những tin tức nóng hổi trong thế giới JavaScript trong tuần mà họ còn quản lý để thêm sự hài hước mới mẻ vào tất cả

Tại sao chúng ta cần let và const trong JavaScript?

khai báo var có phạm vi toàn cục hoặc chức năng có phạm vi trong khi let và const có phạm vi khối . các biến var có thể được cập nhật và khai báo lại trong phạm vi của nó; . Tất cả chúng đều được nâng lên đầu phạm vi của chúng.

Việc sử dụng const trong JavaScript là gì?

Khai báo const tạo tham chiếu chỉ đọc cho một giá trị . Điều đó không có nghĩa là giá trị mà nó nắm giữ là bất biến—chỉ là định danh biến không thể được gán lại. Chẳng hạn, trong trường hợp nội dung là một đối tượng, điều này có nghĩa là nội dung của đối tượng (e. g. , thuộc tính của nó) có thể được thay đổi.

Sự khác biệt giữa let Var và const trong JavaScript là gì?

Trong JavaScript, các từ khóa var , let và const hơi khó hiểu. Vì vậy, trong ảnh này, chúng ta sẽ xem xét sự khác biệt giữa các từ khóa này. . Phạm vi