Javascript 是否具有类似于 Java 的增强的 for 循环语法

Question

I am wondering if JavaScript has an enhanced for loop syntax that allows you to iterate over arrays. For example, in Java, you can simply do the following:

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

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

output is:

hello
there
my
friend

Is there a way to do this in JavaScript? Or do I have to use array.length and use standard for loop syntax as below?

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

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

Answer 1

JavaScript has a foreach -style loop ( for (x in a) ), but it is extremely bad coding practice to use it on an Array . Basically, the array.length approach is correct. There is also a a.forEach(fn) method in newer JavaScripts you can use, but it is not guaranteed to be present in all browsers - and it's slower than the array.length way.

EDIT 2017 : "We'll see how it goes", indeed. In most engines now, .forEach() is now as fast or faster than for(;;) , as long as the function is inline, ie arr.forEach(function() { ... }) is fast, foo = function() { ... }; arr.forEach(foo) foo = function() { ... }; arr.forEach(foo) might not be. One might think that the two should be identical, but the first is easier for the compiler to optimise than the second.

Belated EDIT 2020 : There is now for (const item of iterable) , which solves the downsides of using for (item in iterable) .

Answer 2

Using the latest versions of JavaScript available to most modern browsers, you can do this:

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

Details are at https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach . If you're worried that a browser may not have support for this, you can add it yourself, using a (hopefully minified) version of the implementation that they have listed under "Compatibility".

This is a bit outdated, but this is a minified compatibility version of forEach that I derived from Mozilla's page a few years ago:

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)}}}};

I've never run into any issues with this, but the implementation on Mozilla's page has since been expanded with some additional checks and code to make it compatible with ECMA-262, Edition 5, 15.4.4.18.

I have a file called common.js that I use and include on all of my pages to include this, as well as all of the other "Array extras" that were introduced with JavaScript 1.6, as listed at https://developer.mozilla.org/en/JavaScript/New_in_JavaScript/1.6#Array_extras . (I've been meaning to get this updated and published for public use.)

This may not be the fastest approach (see http://jsperf.com/for-vs-foreach/15 for some specifics - thanks for the link, Amadan) - but there is something to be said for conciseness and maintainability, etc. Additionally, it'll be very interesting to see how much of this disparity is optimized away by further JavaScript engine improvements over the next few months and years. :-)

Answer 3

In ES2015(ES6), you can use the for-of loop. It's supported in most browser with the exception of IE.

let array = [10, 20, 30];

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

See the Mozilla explanation here

Answer 4

You can do for(s in array) , but be careful, it's not the same as a foreach .

In this case s is the key (index), not the value. You also need to use hasOwnProperty because in loops though the object's prototype also.

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

EDIT: As @Amadan pointed out, hasOwnProperty does iterate properties when they're added like this: array.test = function(){} . I suggest not using for...in .

EDIT2: If your using a modern web browser (anything that isn't IE < 9), you can use Array.forEach ). @ziesemer points out that Mozilla has a shim for this if you need to support IE < 9.

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

NOTE: Personally I use jQuery for my JavaScript projects, and I use $.each .

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

Answer 5

There's the "forEach" method on the Array prototype in newer JavaScript engines. Some libraries extend the prototype themselves with a similar method.

Answer 6

Try this:

 var errorList = new Array();
 errorList.push("e1");
 errorList.push("e2");
      
 for (var indx in errorList) {
     alert(errorList[indx]);
 }

Answer 7

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