Javascript có cú pháp vòng lặp nâng cao tương tự như

Question

của Java Tôi tự hỏi nếu JavaScript có cú pháp vòng lặp nâng cao cho phép bạn lặp qua mảng. Ví dụ, trong Java, bạn có thể chỉ cần làm như sau:

String[] array = "hello there my friend".split(" "); 

for (String s : array){ 
    System.out.println(s); 
} 

đầu ra là:

hello 
there 
my 
friend 

Có cách nào để làm điều này trong JavaScript? Hoặc tôi có phải sử dụng array.length và sử dụng cú pháp vòng lặp chuẩn như dưới đây không?

var array = "hello there my friend".split(" "); 

for (i=0;i<array.length;i++){ 
    document.write(array[i]); 
} 

Answer 1

JavaScript có một vòng lặp kiểu foreach (for (x in a)), nhưng nó là vô cùng xấu mã hóa thực hành để sử dụng nó trên một Array. Về cơ bản, cách tiếp cận array.length là chính xác. Cũng có một phương thức a.forEach(fn) trong JavaScripts mới hơn mà bạn có thể sử dụng, nhưng nó không được bảo đảm có mặt trong tất cả các trình duyệt - và nó chậm hơn cách array.length.

CHỈNH SỬA 2017: "Thực vậy, chúng tôi sẽ xem nó như thế nào". Trong hầu hết các công cụ hiện tại, .forEach() hiện nhanh hoặc nhanh hơn for(;;), miễn là chức năng này là nội tuyến, tức là arr.forEach(function() { ... }) là nhanh, foo = function() { ... }; arr.forEach(foo) có thể không hoạt động. Người ta có thể nghĩ rằng hai nên giống hệt nhau, nhưng đầu tiên là dễ dàng hơn cho trình biên dịch để tối ưu hóa hơn so với thứ hai.

Answer 2

Có phương thức "forEach" trên nguyên mẫu Array trong các công cụ JavaScript mới hơn. Một số thư viện mở rộng nguyên mẫu với một phương thức tương tự.

Answer 3

Sử dụng phiên bản mới nhất của JavaScript có sẵn cho hầu hết các trình duyệt hiện đại, bạn có thể làm điều này:

array.forEach(function(x){ 
    document.write(x); 
}); 

Cụ thể tại https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach. Nếu bạn lo lắng rằng một trình duyệt có thể không có hỗ trợ cho điều này, bạn có thể tự thêm nó, bằng cách sử dụng phiên bản triển khai (hy vọng được rút ngắn) mà chúng đã liệt kê trong "Khả năng tương thích".

Đây là một chút lỗi thời, nhưng đây là một phiên bản rút gọn tương thích của forEach mà tôi có nguồn gốc từ trang của Mozilla một vài năm trước đây:

if(!Array.prototype.forEach){Array.prototype.forEach=function(b){if(typeof b!="function"){throw new TypeError()}var a=this.length,d=arguments[1],c;for(c=0;c<a;c++){if(c in this){b.call(d,this[c],c,this)}}}}; 

Tôi chưa bao giờ gặp phải bất kỳ vấn đề với điều này, nhưng thực hiện trên trang của Mozilla đã được mở rộng với một số kiểm tra bổ sung và mã để làm cho nó tương thích với ECMA-262, Phiên bản 5, 15.4.4.18.

Tôi có một tệp có tên là common.js mà tôi sử dụng và bao gồm trên tất cả các trang của mình để bao gồm điều này, cũng như tất cả các tính năng bổ sung khác "Array extras" được giới thiệu với JavaScript 1.6, như được liệt kê tại https://developer.mozilla.org/en/JavaScript/New_in_JavaScript/1.6#Array_extras. (Tôi đã có ý nghĩa để cập nhật và xuất bản để sử dụng công khai.)

Đây có thể không phải là cách tiếp cận nhanh nhất (xem http://jsperf.com/for-vs-foreach/15 cho một số chi tiết cụ thể - cảm ơn liên kết, Amadan) - nhưng có điều gì đó để nói cho sự đồng nhất và bảo trì, vv Ngoài ra, nó sẽ rất thú vị để xem có bao nhiêu sự chênh lệch này được tối ưu hóa bằng cách cải tiến thêm các công cụ JavaScript trong vài tháng và vài năm tới. :-)

Answer 4

Bạn có thể làm for(s in array), nhưng hãy cẩn thận, nó không giống như foreach.

Trong trường hợp này s là khóa (chỉ mục), không phải là giá trị. Bạn cũng cần phải sử dụng hasOwnProperty vì in vòng mặc dù đối tượng cũng là prototype.

for(s in array){ 
    if(array.hasOwnProperty(s)){ 
     console.log(array[s]); 
    } 
} 

EDIT: Như @Amadan chỉ ra, hasOwnPropertykhông tính lặp khi họ đang bổ sung như sau: array.test = function(){}. Tôi đề xuất không phải sử dụng for...in.

EDIT2: Nếu bạn đang sử dụng trình duyệt web hiện đại (mọi thứ không phải là IE < 9), bạn có thể sử dụng Array.forEach). @ziesemer chỉ ra rằng Mozilla has a shim cho điều này nếu bạn cần hỗ trợ IE < 9.

array.forEach(function(s){ 
    console.log(s); 
}); 

Chú ý: Cá nhân tôi sử dụng cho các dự án jQuery JavaScript của tôi, và tôi sử dụng $.each.

$.each(array, function(i,s){ 
    console.log(s); 
}); 

Answer 5

x = [1,2,3]; 
for (i in x) { 
    console.log(i); 
} 

Answer 6

Trong ES2015 (ES6), bạn có thể sử dụng for-of vòng lặp. Nó được hỗ trợ trong hầu hết các trình duyệt với ngoại lệ của IE.

let array = [10, 20, 30]; 

for (let value of array) { 
    console.log(value); 
} 

See the Mozilla explanation here

Answer 7

Hãy thử điều này,

var errorList = new Array(); 
     errorList.push("e1"); 
     errorList.push("e2"); 

     for (var indx in errorList){ 
       alert(errorList[indx]); 
      }