3 phần của vòng lặp for trong JavaScript là gì?

Mọi người đều biết ít nhất một phiên bản của vòng lặp For, đây là phiên bản cổ điển và có lẽ hầu hết mọi ngôn ngữ đều có phiên bản của nó. Tuy nhiên, JavaScript có ba (hoặc 4 nếu bạn thực sự kén chọn về nó) và chúng không hoàn toàn giống nhau, tất nhiên tôi đang đề cập đến

• Vòng lặp For cổ điển
• For… of và For…in pair
• Và phiên bản lạ mắt, chức năng. . cho mỗi

Có sự khác biệt giữa tất cả các phiên bản, vì vậy trong bài viết này, tôi muốn đề cập đến cả ba phiên bản và cách thức hoặc thời điểm sử dụng chúng để có kết quả tối ưu. Chúng ta hãy nứt

mẹo hữu ích. Sử dụng Bit để đóng gói các thành phần với tất cả các phụ thuộc và thiết lập của chúng. Xây dựng các ứng dụng mô-đun thực sự với khả năng sử dụng lại mã tốt hơn, bảo trì đơn giản hơn và ít chi phí hơn

Chia sẻ các thành phần mã có thể tái sử dụng theo nhóm · Bit

Dễ dàng chia sẻ các thành phần có thể tái sử dụng giữa các dự án và ứng dụng để xây dựng nhanh hơn theo nhóm. Hợp tác để phát triển…

chút. nhà phát triển

Vậy là chúng ta đã rõ, đây là vòng lặp For cổ điển, nơi bạn xác định bộ đếm bên trong của mình, đặt điều kiện ngắt và thay đổi bước (thường là tăng hoặc giảm bộ đếm)

Cú pháp là

for([counter definition];[breaking condition definition];[step definition]){
   //.. your repeating code goes here}

Bây giờ, tôi chắc rằng bạn đã viết đoạn mã đó trước đây và dạng phổ biến nhất của nó là

for(let counter = 0; counter < 10; counter++) {
  console.log(counter)
}

Và trong khi mã đó hoạt động hoàn toàn tốt, các phần của vòng lặp For linh hoạt hơn thế. Trên thực tế, bạn nên nghĩ về chúng như

for(
[EXPRESSION EXECUTED ONLY ONCE AT THE START OF THE LOOP];
[BOOLEAN CONDITION CHECKED ON EVERY STEP];
[EXPRESSION EXECUTED ON EVERY STEP OF THE LOOP]
)

Có nghĩa là, bạn có thể thực hiện các vòng lặp For với nhiều bộ đếm hoặc thực thi mã trên mỗi bước mà không nhất thiết ảnh hưởng đến bộ đếm của bạn. Chỉ kể tên một vài ví dụ

Ví dụ, đây là một vòng lặp hoàn toàn hợp lệ

Bạn thậm chí có thể đẩy nó đi xa hơn và di chuyển ra khỏi các trường hợp sử dụng bình thường từ phía trên

Bạn thậm chí có thể thay thế biểu thức ở giữa cho một lệnh gọi hàm, miễn là bạn nhớ rằng giá trị trả về của hàm sẽ được chuyển thành boolean

Còn việc xử lý mã không đồng bộ bên trong vòng lặp For cổ điển thì sao?

Lưu ý cách chúng ta có thể đơn giản sử dụng vòng lặp của mình giống như không có cơ chế không đồng bộ nào đang hoạt động ở phía sau. Đó là tất cả không đồng bộ/chờ đợi, nhưng nhờ nó, chúng tôi quay lại phụ thuộc vào một cấu trúc cơ bản, chẳng hạn như vòng lặp For để lặp qua một tập hợp các hướng dẫn không đồng bộ

Trước đây, nếu bạn muốn đạt được điều tương tự bằng cách sử dụng các lệnh gọi lại hoặc lời hứa, logic sẽ phức tạp hơn rất nhiều. Đó là lý do tại sao các thư viện như async. js được sinh ra

BTW, một lưu ý nhỏ. vòng lặp for trong ví dụ của tôi nằm trong IIFE đơn giản vì như bạn có thể đã biết, lệnh chờ đợi cần phải nằm trong hàm async, nếu không thì Node sẽ không cho phép điều đó

Vâng, chúng là các biến thể khá giống với phiên bản trước nhưng đồng thời, chúng là các vòng lặp khác nhau

Hãy để tôi nhanh chóng xác định chúng

cho. trong vòng lặp xử lý các thuộc tính không phải là biểu tượng, có thể đếm được từ một đối tượng (từ khóa ở đó là “đối tượng” vì hầu hết mọi thứ trong JavaScript đều là một đối tượng). Điều này rất hữu ích cho các trường hợp khi bạn đang sử dụng đối tượng tùy chỉnh của mình làm bản đồ băm hoặc từ điển (một cách làm rất phổ biến)

Tuy nhiên, lưu ý rằng phép lặp được thực hiện theo một thứ tự tùy ý, vì vậy đừng dựa vào vòng lặp để chọn đúng thứ tự bạn cần và đảm bảo rằng bạn kiểm soát phần đó nếu nó hợp lý

Khá đơn giản, phải không? . Chẳng hạn, nếu bạn muốn lặp lại từng ký tự trong một Chuỗi (là một Đối tượng), đây là điều sẽ xảy ra nếu bạn sử dụng For… trong

Thay vì lặp lại từng ký tự của chuỗi, chúng tôi lặp lại từng thuộc tính và như bạn có thể thấy, chúng tôi thực sự đang xử lý một cấu trúc (đối với kiểu Chuỗi) rất giống với một Mảng. Và điều đó có ý nghĩa sau tất cả, vì việc thực hiện "Hello World!"[1] không chỉ hoạt động mà còn trả về ký tự thực tại vị trí đó (i. e chữ cái 'e')

Thay vào đó, nếu bạn muốn lặp lại từng ký tự, bạn cần sử dụng biến thể khác. Cho…của

Bây giờ, điều đó có ý nghĩa hơn, phải không? . Và tất nhiên, các đối tượng của riêng bạn, nếu bạn định nghĩa chúng là các lần lặp

Theo ví dụ trên, không có cách nào trực tiếp để lấy chỉ mục hiện tại cho vòng lặp, tất nhiên, trừ khi bạn xác định nó bên ngoài vòng lặp của mình và cập nhật nó trên mỗi bước hoặc bạn có thể nhận được cả chỉ mục và giá trị nếu bạn sử dụng phương thức entries

Và cuối cùng, để theo kịp sự so sánh, mã không đồng bộ thì sao?

Cả hai vòng lặp phản ứng chính xác theo cùng một cách với cấu trúc chờ đợi, cho phép bạn viết mã đơn giản và sạch hơn

Cái này có lẽ là cái tôi thích nhất trong số rất nhiều, và đó đơn giản là bởi vì tôi là một fan hâm mộ lớn của cú pháp khai báo hoặc một cách khai báo để viết mã của bạn theo mệnh lệnh. Và mặc dù các phiên bản trên của vòng lặp hoạt động tốt và có các trường hợp sử dụng rất tốt của riêng chúng, nhưng chúng cũng rất bắt buộc theo nghĩa là chúng tôi bắt buộc phải viết những gì cần xảy ra với dữ liệu của mình thay vì chỉ viết những gì chúng tôi muốn.

Dù sao đi nữa, để các cuộc tranh luận triết học sang một bên,. Phương thức forEach là một phiên bản khác của vòng lặp For, tuy nhiên, phương thức này là một phần của đối tượng Array và có nghĩa là nhận một hàm và một tham số bổ sung, tùy chọn để xác định lại ngữ cảnh của hàm đó trong khi thực thi nó

Đối với mọi phần tử bên trong mảng, hàm của chúng ta sẽ được thực thi và nó sẽ nhận được ba đối số (vâng, bạn đã đọc đúng ba đối số đó, không phải một đối số như bạn đã quen sử dụng nó). Và họ là

1. Phần tử hiện tại đang được xử lý
2. Chỉ mục của phần tử, điều này đã đơn giản hóa nhiệm vụ mà chúng tôi đã cố gắng đạt được với vòng lặp For…of
3. Mảng thực tế đang được xử lý. Chỉ trong trường hợp bạn cần phải làm gì đó với nó

Để tiếp tục với các ví dụ, hãy xem nhanh

Nhanh chóng và đơn giản, nhưng bạn thấy cách chúng ta có thể sử dụng tất cả các thuộc tính khá dễ dàng bên trong hàm của mình. Và đây là một ví dụ về thời điểm bạn muốn sử dụng tham số tùy chọn thứ hai trên phương thức forEach

Bằng cách ghi đè ngữ cảnh của hàm được gọi là greet, tôi có thể thay đổi hành vi của nó mà không ảnh hưởng đến mã của nó

Và để hoàn thiện, chỉ ra rằng phương thức này cũng có thể được sử dụng với mã không đồng bộ, đây là ví dụ

Lưu ý rằng tôi không còn cần IIFE nữa vì tôi đang khai báo cuộc gọi lại là không đồng bộ

Đó là tất cả những gì tôi muốn chia sẻ về vòng lặp For trong JavaScript, tôi hy vọng rằng bây giờ bạn đã hiểu rõ hơn về chúng và có thể chọn và chọn cái nào bạn thích dựa trên kiến ​​thức đó và nhu cầu mã hóa hiện tại của chúng tôi

3 phần quan trọng của vòng lặp for là gì?

Cấu trúc 3 vòng lặp là gì?

Các phần của vòng lặp for là gì?

3 câu lệnh của vòng lặp là gì?