Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
514 views
in Technique[技术] by (71.8m points)

javascript - 使用JavaScript中的语法获取循环计数器/索引(Get loop counter/index using for…of syntax in JavaScript)

Caution:(警告:)

question still applies to for…of loops.> Don't use for…in to iterate over an Array , use it to iterate over the properties of an object.

(问题仍然适用for…of循环。>不要使用for…in迭代一个数组 ,用它来迭代一个对象的属性 。)

That said, this

(那说,这个)


I understand that the basic for…in syntax in JavaScript looks like this:

(我理解JavaScript for…in语法的基本原理如下:)

for (var obj in myArray) {
    // ...
}

But how do I get the loop counter/index ?

(但是如何获得循环计数器/索引 ?)

I know I could probably do something like:(我知道我可能做的事情如下:)

var i = 0;
for (var obj in myArray) {
    alert(i)
    i++
}

Or even the good old:(甚至是好老:)

for (var i = 0; i < myArray.length; i++) {
    var obj = myArray[i]
    alert(i)
}

But I would rather use the simpler for-in loop.

(但我宁愿使用更简单的for-in循环。)

I think they look better and make more sense.

(我认为它们看起来更好,更有意义。)

Is there a simpler or more elegant way?

(有更简单或更优雅的方式吗?)


In Python it's easy:(在Python中很简单:)

for i, obj in enumerate(myArray):
    print i
  ask by hobbes3 translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

for…in iterates over property names, not values, and does so in an unspecified order (yes, even after ES6).

(for…in迭代属性名称,而不是值,并以未指定的顺序执行 (是的,即使在ES6之后)。)

You shouldn't use it to iterate over arrays.

(您不应该使用它来迭代数组。)

For them, there's ES5's forEach method that passes both the value and the index to the function you give it:

(对于他们来说,有ES5的forEach方法,它将值和索引传递给你给它的函数:)

var myArray = [123, 15, 187, 32];

myArray.forEach(function (value, i) {
    console.log('%d: %s', i, value);
});

// Outputs:
// 0: 123
// 1: 15
// 2: 187
// 3: 32

Or ES6's Array.prototype.entries , which now has support across current browser versions:

(或ES6的Array.prototype.entries ,现在支持当前的浏览器版本:)

for (const [i, value] of myArray.entries()) {
    console.log('%d: %s', i, value);
}

For iterables in general (where you would use a for…of loop rather than a for…in ), there's nothing built-in, however:

(对于一般的iterables(你将使用for…of循环而不是for…in ),没有内置的东西,但是:)

function* enumerate(iterable) {
    let i = 0;

    for (const x of iterable) {
        yield [i, x];
        i++;
    }
}

for (const [i, obj] of enumerate(myArray)) {
    console.log(i, obj);
}

demo

(演示)

If you actually did mean for…in – enumerating properties – you would need an additional counter.

(如果你真的意味着for…in - 枚举属性 - 你需要一个额外的计数器。)

Object.keys(obj).forEach could work, but it only includes own properties;

(Object.keys(obj).forEach可以工作,但它只包含自己的属性;)

for…in includes enumerable properties anywhere on the prototype chain.

(for…in包括原型链上任何位置的可枚举属性。)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...