Hướng dẫn which for loop is best in javascript? - vòng lặp for nào là tốt nhất trong javascript?

URL: https://javascript.plainenglish.io/which-type-of-loop-is-fastest-in-javascript-ec834a0f21b9

JavaScript là một cảm giác mới của phát triển web. Không chỉ các khung JS như NodeJS, React, Angular Vue, v.v. Nhưng, Vanilla JS cũng có một lượng lớn quạt. Hãy nói về JavaScript hiện đại. Các vòng lặp luôn là một phần lớn của hầu hết các ngôn ngữ lập trình. JS hiện đại cung cấp cho bạn rất nhiều cách để lặp lại hoặc lặp lại các giá trị của bạn.

Nhưng câu hỏi là bạn có thực sự biết vòng lặp hoặc lặp phù hợp nhất theo yêu cầu của bạn. Có rất nhiều tùy chọn có sẵn trong các vòng lặp, cho, cho (đảo ngược), cho ... của, foreach, cho ... in, cho ... chờ đợi. Bài viết này sẽ bao gồm một cuộc tranh luận như vậy.

Cái nào cho vòng lặp nhanh hơn?

Trả lời: cho (đảo ngược) for (reverse)

Điều đáng ngạc nhiên nhất là khi tôi thử nghiệm nó trên một máy địa phương, tôi bắt đầu tin rằng (đảo ngược) là nhanh nhất trong số tất cả các vòng lặp. Hãy để tôi chia sẻ một ví dụ. Lấy một mảng với hơn 1 triệu mục và thực hiện cho một vòng lặp.

*Tuyên bố miễn trừ trách nhiệm: Console.time () Độ chính xác kết quả phụ thuộc vào cấu hình hệ thống của bạn. Nhìn kỹ hơn về độ chính xác ở đây.*: console.time() result accuracy highly depends on your system configuration. Get a closer look at accuracy here.*

const million = 1000000;
const arr = Array(million);

console.time('⏳');

for (let i = arr.length; i > 0; i--) {} // for(reverse) :- 1.5ms

for (let i = 0; i < arr.length; i++) {} // for          :- 1.6ms

arr.forEach(v => v)                     // foreach      :- 2.1ms

for (const v of arr) {}                 // for...of     :- 11.7ms

console.timeEnd('⏳');

Lý do: Ở đây, chuyển tiếp và đảo ngược cho vòng lặp mất gần như cùng một lúc. Chỉ cần có sự khác biệt 0,1ms là có vì (đảo ngược) tính toán biến bắt đầu, hãy để i = mảng.length chỉ một lần. Trong khi trong vòng lặp chuyển tiếp cho vòng lặp, nó kiểm tra điều kiện i

Ở nửa kia, Foreach là một phương pháp của một nguyên mẫu mảng. So sánh với bình thường cho vòng lặp, foreach và cho ... dành nhiều thời gian hơn cho việc lặp lại trong mảng.

Các loại vòng lặp và bạn nên sử dụng chúng ở đâu

1. cho vòng lặp (chuyển tiếp và đảo ngược)

Có lẽ mọi người đều quen thuộc với vòng lặp này. Bạn có thể sử dụng cho Loop, nơi bạn cần, chạy một khối mã lặp lại để sửa thời gian truy cập. Truyền thống cho vòng lặp là nhanh nhất, vì vậy bạn nên luôn luôn sử dụng đúng? Không quá nhanh - hiệu suất không phải là điều duy nhất quan trọng. Khả năng đọc mã thường quan trọng hơn, vì vậy mặc định theo kiểu phù hợp với ứng dụng của bạn.

2. foreach

Phương thức này chấp nhận hàm gọi lại làm tham số đầu vào và cho mọi phần tử từ một mảng, chức năng gọi lại này thực thi. Ngoài ra, Foreach chức năng gọi lại chấp nhận một giá trị hiện tại và chỉ mục tương ứng. Ngoài ra, cho phép sử dụng điều này cho các tham số tùy chọn trong hàm gọi lại.

const things = ['have', 'fun', 'coding'];

const callbackFun = (item, idex) => {
    console.log(`${item} - ${index}`);
}

things.foreach(callbackFun);

o/p:- have - 0
      fun - 1
      coding - 2

Lưu ý:- Nếu bạn sử dụng foreach, bạn không thể có đòn bẩy của mạch ngắn trong JavaScript. Nếu bạn không biết về ngắn mạch, hãy để tôi giới thiệu với bạn. Khi chúng ta sử dụng toán tử logic như và (&&) hoặc (|

3. Đối với… của

Các ... của được tiêu chuẩn hóa trong ES6 (ECMAScript 6). Việc tạo ra một vòng lặp lặp trên một đối tượng có thể lặp lại như một mảng, bản đồ, bộ, chuỗi, v.v ... Một điểm cộng khác của vòng lặp này là khả năng đọc tốt hơn.

const arr = [3, 5, 7];
const str = 'hello';

for (let i of arr) {
   console.log(i); // logs 3, 5, 7
}

for (let i of str) {
   console.log(i); // logs 'h', 'e', 'l', 'l', 'o'
}

Lưu ý:- Đừng sử dụng lại cho ... của các máy phát điện, ngay cả khi ... của bị chấm dứt sớm. Sau khi thoát khỏi vòng lặp, máy phát điện bị tắt và cố gắng lặp lại nó không mang lại kết quả nào nữa.

4. Đối với… trong

For ... trong lặp lại một biến được chỉ định trên tất cả các thuộc tính có thể suy định của một đối tượng. Đối với mỗi thuộc tính riêng biệt, câu nói cho ... trong câu lệnh sẽ trả về tên của các thuộc tính do người dùng xác định của bạn ngoài các chỉ mục số.

Do đó, tốt hơn là sử dụng một vòng lặp truyền thống cho một chỉ số số khi lặp qua các mảng. Bởi vì cho ... trong câu lệnh lặp đi lặp lại các thuộc tính do người dùng xác định ngoài các phần tử mảng, ngay cả khi bạn sửa đổi đối tượng mảng (chẳng hạn như thêm các thuộc tính hoặc phương thức tùy chỉnh).

const details = {firstName: 'john', lastName: 'Doe'};
let fullName = '';

for (let i in details) {
    fullName += details[i] + ' '; // fullName: john doe
}

Sự khác biệt giữa cho..of và cho ... trong

Sự khác biệt chính giữa cho..of và ... trong là những gì họ lặp lại. Cho ... trong các vòng lặp lặp lại các thuộc tính của một đối tượng trong khi ... các vòng lặp lặp lại các giá trị của một đối tượng có thể lặp lại.

let arr= [4, 5, 6];

for (let i in arr) {
   console.log(i); // '0', '1', '2'
}

for (let i of arr) {
   console.log(i); // '4', '5', '6'
}

Sự kết luận

• Đối với nhanh nhất, nhưng kém về khả năng đọc.

• foreach nhanh, kiểm soát tài sản lặp.

• cho ... chậm, nhưng ngọt ngào hơn.

• cho ... chậm, ít tiện dụng hơn.

Cuối cùng, một lời khuyên khôn ngoan cho bạn. Đặt mức độ ưu tiên của bạn cho khả năng đọc. Khi bạn đang phát triển một cấu trúc phức tạp tại thời điểm đó, khả năng đọc mã là rất cần thiết nhưng bạn cũng nên tập trung vào hiệu suất. Cố gắng tránh thêm trang trí thêm không cần thiết trong mã của bạn đôi khi nó tốn kém cho hiệu suất ứng dụng của bạn. Có mã hóa vui vẻ.