HomeLập trìnhJavaScriptHướng dẫn JS...

Hướng dẫn JS For Loop – Cách lặp qua một mảng trong JavaScript


Bài viết này sẽ cung cấp cho bạn kiến ​​thức vững chắc về chính xác cách lặp qua cấu trúc dữ liệu Mảng trong JavaScript.

Cho dù bạn mới bắt đầu học JavaScript hay đang ở đây để ôn tập lại, sẽ luôn có giá trị cho bạn. Bài viết này sẽ hướng dẫn bạn một trong những khái niệm JavaScript được sử dụng rộng rãi nhất.

Mảng là gì?

let cars = ["Tesla", "Ferrari", "Lamborghini", "Audi"];

Trên đây là một mảng JavaScript được sử dụng để lưu trữ nhiều giá trị. Đây là một trong những dạng đơn giản nhất của mảng. Nó chứa 4 “phần tử” bên trong mảng, tất cả là các chuỗi. Và như bạn có thể thấy, mỗi phần tử được phân tách bằng dấu phẩy.

Mảng ví dụ này chứa các loại ô tô khác nhau và có thể được tham chiếu bằng cars Biến đổi.

Có một số cách chúng ta có thể lặp lại mảng này. JavaScript cực kỳ phong phú về tính năng, vì vậy chúng ta có quyền lựa chọn cách tốt nhất để giải quyết vấn đề của mình.

Đây là cách chúng ta giải quyết vấn đề lặp qua mảng trong JavaScript:

  1. Làm nổi bật 5 phương pháp phổ biến để lặp qua một mảng
  2. Hiển thị một số hiểu biết về từng phương pháp lặp
  3. Cung cấp một số mã bạn có thể sử dụng để kiểm tra nó!

Vòng lặp truyền thống

Vòng lặp For là gì?

Đây là một định nghĩa đơn giản về Vòng lặp For:

“Trong khoa học máy tính, một vòng lặp for (hoặc đơn giản cho vòng lặp) là một câu lệnh luồng điều khiển để chỉ định phép lặp, cho phép mã được Thực thi nhiều lần.”

Vòng lặp for là một cách để thực thi mã lặp đi lặp lại. Thay vì gõ ra console.log(“hi”) năm lần, bạn có thể bọc nó bên trong vòng lặp for.

Trong ví dụ đầu tiên này, chúng ta sẽ tìm hiểu cách lặp lại mảng ô tô mà bạn đã thấy ở trên và in ra mọi phần tử. Bộ lặp hoặc bộ đếm sẽ bắt đầu ở chỉ mục đầu tiên “Tesla” và kết thúc ở “Audi” cuối cùng. Nó di chuyển qua mảng và in từng phần tử một.

let cars = ["Tesla", "Ferrari", "Lamborghini", "Audi"];

for(let i = 0; i < cars.length; i++) {
  console.log(cars[i]);
}

Đầu ra:

Tesla
Ferrari
Lamborghini
Audi

Đi sâu vào mã, chúng tôi chuyển ba tùy chọn cho vòng lặp for

  • biến lặp – let i = 0;
  • nơi trình vòng lặp nên dừng lại – i < card.length
  • tăng bao nhiêu cho trình vòng lặp mỗi vòng lặp – i++

Vòng lặp này bắt đầu với chúng tôi tại tăng biến theo từng vòng lặp và dừng khi chúng ta chạm vào phần tử cuối cùng trong mảng.

Đọc thêm  sự khác biệt được giải thích với bánh

Lợi ích chính của vòng lặp for truyền thống là bạn có nhiều quyền kiểm soát hơn.

Có thể truy cập các phần tử khác nhau trong mảng hoặc lặp qua mảng theo cách phức tạp để giải quyết một vấn đề phức tạp. Ví dụ, việc bỏ qua mọi phần tử khác trong mảng có thể được thực hiện khá dễ dàng với vòng lặp for truyền thống.

Phương thức forEach

Phương thức forEach là gì?

Các forEach phương thức được sử dụng để thực thi một hàm cho từng phần tử trong mảng của bạn. Phương pháp này là một lựa chọn tuyệt vời nếu độ dài của mảng là “không xác định” hoặc được đảm bảo thay đổi. Phương pháp này chỉ có thể được sử dụng với Mảng, Tập hợp và Bản đồ.

const amounts = [65, 44, 12, 4];
let doubledAmounts = [];

amounts.forEach(item => {
  doubledAmounts.push(item * 2);
})

console.log(doubledAmounts);

Lợi ích lớn nhất của một forEach vòng lặp có thể truy cập từng mục, ngay cả khi mảng của bạn có khả năng tăng kích thước. Đây là một giải pháp có thể mở rộng cho nhiều trường hợp sử dụng và dễ đọc và dễ hiểu hơn so với vòng lặp for truyền thống vì chúng tôi biết rằng chúng tôi sẽ lặp lại từng phần tử chính xác một lần.

Trong khi lặp lại

Vòng lặp While là gì?

Đây là một định nghĩa đơn giản về Vòng lặp While:

“MỘT trong khi lặp lại là một câu lệnh luồng điều khiển cho phép mã được thực thi lặp đi lặp lại dựa trên một điều kiện Boolean nhất định. Các trong khi vòng lặp có thể được coi là một câu lệnh if lặp đi lặp lại.

Một while vòng lặp là một cách để thực thi mã lặp đi lặp lại để kiểm tra xem một điều kiện là đúng hay sai. Vì vậy, thay vì sử dụng vòng lặp for, với câu lệnh if lồng nhau, chúng ta có thể sử dụng vòng lặp while. Hoặc, nếu chúng ta không thể tìm thấy độ dài của mảng, thì các vòng lặp while là một lựa chọn tuyệt vời.

Vòng lặp while thường được điều khiển bởi một bộ đếm. Trong ví dụ dưới đây, chúng tôi hiển thị một vòng lặp while cơ bản lặp qua một mảng. Điều quan trọng là phải có quyền kiểm soát vòng lặp while mà bạn đang tạo.

Đọc thêm  Cách xây dựng hành động GitHub JavaScript đầu tiên của bạn

Ví dụ về vòng lặp While (Tốt):

let i = 0 

while (i < 5) { 
  console.log(i); 
  i++; 
}

đầu ra:

0
1
2
3
4

Câu lệnh if của vòng lặp while là i < 5, hoặc nói to, “tôi nhỏ hơn 5 tuổi”. biến i được tăng lên mỗi khi vòng lặp chạy.

Nói một cách đơn giản, điều này có nghĩa là 1 được thêm vào biến i mỗi khi vòng lặp thực hiện một lần lặp đầy đủ. Ở lần lặp đầu tiên, i bằng 0 và chúng tôi in “0” ra bàn điều khiển.

Rủi ro lớn nhất khi sử dụng vòng lặp while là viết một điều kiện không bao giờ được đáp ứng.

Điều này xảy ra thường xuyên trong các tình huống trong thế giới thực, nơi ai đó viết một vòng lặp while nhưng quên kiểm tra vòng lặp của họ và nó đưa một vòng lặp vô hạn vào cơ sở mã.

Một vòng lặp vô hạn xảy ra khi điều kiện không bao giờ được đáp ứng và vòng lặp cứ chạy mãi mãi. Điều này thường dẫn đến các thay đổi bị hỏng, sau đó khiến toàn bộ ứng dụng phần mềm bị hỏng và ngừng hoạt động.

Cảnh báo: Không chạy mã này.

Ví dụ về vòng lặp vô hạn (Xấu):

let i = 0 

while (i < 5) { 
  console.log(i); 
}

Đầu ra:

Kết quả có thể thay đổi.

Vòng lặp Do While

Vòng lặp do while là gì?

Đây là một định nghĩa đơn giản về vòng lặp Do-While:

“một làm vòng lặp trong khi là một câu lệnh luồng điều khiển thực thi một khối mã ít nhất một lầnsau đó liên tục thực thi khối hoặc không, tùy thuộc vào một điều kiện boolean nhất định ở cuối khối.”

Vòng lặp do-while gần giống với vòng lặp while, tuy nhiên có một điểm khác biệt chính. Vòng lặp do-while sẽ đảm bảo luôn thực thi khối mã ít nhất một lần trước khi câu lệnh if được kiểm tra.

Tôi thường nghĩ về nó như một vòng lặp while đảo ngược, và hầu như không bao giờ sử dụng chúng. Tuy nhiên, chúng có ích trong một số tình huống rất cụ thể.

Ví dụ Do-Loop (Tốt):

let i = 0; 

do { 
  console.log(i); 
  i++; 
} while (i < 5);

đầu ra:

0
1
2
3
4

Rủi ro lớn nhất khi sử dụng vòng lặp do-loop là viết một điều kiện không bao giờ được đáp ứng. (Tương tự như với Vòng lặp While.)

Cảnh báo: Không chạy mã này.

Đọc thêm  Hướng dẫn JavaScript Array.filter() – Cách lặp qua các phần tử trong một mảng

Ví dụ về vòng lặp vô hạn (Xấu):

let i = 0; 

do { 
  console.log(i); 
} while (i < 5);

đầu ra:

Kết quả có thể thay đổi.

Bạn muốn đưa kiến ​​thức JavaScript của mình lên một tầm cao mới? Tìm hiểu về mapgiống như forEach, nhưng với một phần thưởng!! ?

THƯỞNG Ví dụ (Lặp lại với bản đồ)

bản đồ là gì?

Đây là một định nghĩa đơn giản về bản đồ:

“Trong nhiều ngôn ngữ lập trình, bản đồ là tên của một hàm bậc cao áp dụng một hàm đã cho cho từng phần tử của một functor, ví dụ: một danh sách, trả về một danh sách các kết quả theo cùng một thứ tự. Nó thường được gọi là áp dụng cho tất cả khi được xem xét ở dạng chức năng.

Làm thế nào nó hoạt động? Các map hàm trong JavaScript áp dụng một hàm cho mọi yếu tố bên trong mảng. Hãy dành một chút thời gian để đọc lại câu đó.

Sau đó, các map trả về một mảng mới với kết quả của việc áp dụng một hàm cho mọi phần tử trong mảng.

Bản đồ ví dụ:

const array = [1, 1, 1, 1];

// pass a function to map
const results = array.map(x => x * 2);

console.log(results);

đầu ra:

[2,2,2,2]

Chúng tôi đã áp dụng các map hàm vào mảng chứa bốn số 1. Các map sau đó nhân mỗi phần tử với 2, nghĩa là, x * 2và trả về một mảng mới. Mảng mới sau đó được lưu trữ trong results Biến đổi.

Bằng cách xem đầu ra của chúng tôi, chúng tôi có thể thấy điều này đã hoạt động thành công. Mỗi phần tử trong mảng đã được nhân với 2. Phương pháp này có thể được sử dụng để thay thế vòng lặp trong một số trường hợp và cực kỳ hiệu quả.

Phần kết luận

Làm tốt! Bạn đã học được năm cách khác nhau để lặp lại một mảng trong JavaScript. Đây là những khối xây dựng cơ bản sẽ giúp bạn thành công trong hành trình lập trình JavaScript của mình.

Bạn cũng đã được tiếp xúc với một khái niệm nâng cao, mapđược sử dụng thường xuyên trong các ứng dụng phần mềm quy mô lớn.

Vì vậy, tôi sẽ để lại cho bạn điều này: bạn sẽ sử dụng mảng như thế nào trong các dự án của mình? Và bạn thấy phương pháp lặp nào thú vị nhất?

Cảm ơn vì đã đọc!

Nếu bạn thích bài viết của tôi, hãy theo dõi tôi và/hoặc gửi tin nhắn cho tôi!

Twitter • Phương tiện • Github





Zik.vn – Biên dịch & Biên soạn Lại

spot_img

Create a website from scratch

Just drag and drop elements in a page to get started with Newspaper Theme.

Buy Now ⟶

Bài viết liên quang

DMCA.com Protection Status