JavaScript 구문에서 사용하는 루프 카운터/인덱스를 가져오려면 핫

JavaScript 구문에서 사용하는 루프 카운터/인덱스를 가져오려면 핫

주의:

질문은 아직 유효하다for…of>사용하지 않다for…in배열에 대해 반복하려면 이 명령을 사용하여 객체의 특성에 대해 반복하십시오.그렇긴 하지만, 이건

---

기본적인 것은 이해한다for…inJavaScript의 구문은 다음과 같습니다.

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

하지만 루프 카운터/인덱스는 어떻게 얻을 수 있을까요?

저는 아마 다음과 같은 일을 할 수 있을 겁니다.

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

좋은 노인도 마찬가지입니다.

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

하지만 난 더 간단한 걸 쓰고 싶어for-in루프가 더 잘 어울리고 말이 되는 것 같아요.

좀 더 심플하거나 우아한 방법이 있을까요?

---

Python에서는 간단합니다.

for i, obj in enumerate(myArray):
    print i

for…in는 값이 아닌 속성 이름을 반복하고 지정되지 않은 순서로 반복합니다(ES6 이후에도 마찬가지).어레이를 반복할 때는 사용하지 마십시오.이들에게는 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

또는 ES6는 현재 브라우저 버전 전체에서 지원됩니다.

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

일반적으로 반복 가능한 경우(사용할 수 있는 경우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);
}

데모

만약 당신이 정말로for…in– 속성 열거 – 추가 카운터가 필요합니다. Object.keys(obj).forEach동작할 수 있지만, 자신의 속성만을 포함합니다.for…in에는 프로토타입 체인의 모든 위치에 열거 가능한 특성이 포함됩니다.

ES6에서는 다음 명령어를 사용하는 것이 좋습니다.for... ofloop. 인덱스를 가져올 수 있습니다.for... of이것처럼.

for (let [index, val] of array.entries()) {
  // your code goes here    
}

주의:Array.entries()는 for-of-loop에서 동작할 수 있는 반복기를 반환합니다.이것을 키와 값의 쌍의 배열을 반환하는 Object.entries()와 혼동하지 마십시오.

이건 어때?

let numbers = [1,2,3,4,5]
numbers.forEach((number, index) => console.log(`${index}:${number}`))

어디에array.forEach이 방법에는index배열에서 처리 중인 현재 요소의 인덱스입니다.

소규모 어레이 컬렉션용 솔루션:

for (var obj in arr) {
    var i = Object.keys(arr).indexOf(obj);
}

ar - ARRAY, obj - 현재 요소의 키, i - 카운터/인덱스

주의: IE 버전 <9에서는 메서드 키()를 사용할 수 없습니다.폴리필 코드를 사용해야 합니다.https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

for-in-loops는 오브젝트의 속성에서 반복됩니다.동작하는 경우도 있습니다만, 어레이에는 사용하지 말아 주세요.

오브젝트 속성은 인덱스가 없으며 모두 동일하며 정해진 순서로 실행할 필요가 없습니다.속성을 카운트하려면 첫 번째 예시와 같이 추가 카운터를 설정해야 합니다.

어레이를 통한 루프:

var a = [];
for (var i=0; i<a.length; i++) {
    i // is the index
    a[i] // is the item
}

오브젝트 위의 루프:

var o = {};
for (var prop in o) {
    prop // is the property name
    o[prop] // is the property value - the item
}

다른 사람들이 말한 것처럼, 당신은..배열을 반복하다.

for ( var i = 0, len = myArray.length; i < len; i++ ) { ... }

보다 알기 쉬운 구문을 사용하고 싶은 경우는, 다음의 각 항목을 사용할 수 있습니다.

myArray.forEach( function ( val, i ) { ... } );

이 방법을 사용하려면 ES5 shim을 포함하여 오래된 브라우저에 대한 지원을 추가해야 합니다.

rushUp이 제공하는 답변은 맞지만 이 방법이 더 편리합니다.

for (let [index, val] of array.entries() || []) {
   // your code goes here    
}

"loop " "retrieve array" "retrieve" "retrieve" "retrieve" "retrieve" "retrieve" "retrieve" "retarray1.indexOf(element)을 사용하다이 방법을 사용하면 인덱스와 값을 모두 반환할 수 있습니다.

array1 = ['a', 'b', 'c']
for (element of array1) {
    console.log(array1.indexOf(element), element) // 0 a 1 b 2 c
}

코멘트에서 설명한 바와 같이 배열에 고유하지 않은 값이 포함되어 있으면 false 인덱스가 반환됩니다.(arr = ['a', 'b', 'c', 'a', arr[3] 인덱스는 3 대신 0을 반환합니다.)

함수가 있어요.eachWithIndex반복할 수 있는 모든 것과 함께 작동합니다.

를 쓸 요.eachWithKeyobjets를 사용한 for...in.

// example generator (returns an iterator that can only be iterated once)
function* eachFromTo(start, end) { for (let i = start; i <= end; i++) yield i }

// convers an iterable to an array (potential infinite loop)
function eachToArray(iterable) {
    const result = []
    for (const val of iterable) result.push(val)
    return result
}

// yields every value and index of an iterable (array, generator, ...)
function* eachWithIndex(iterable) {
    const shared = new Array(2)
    shared[1] = 0
    for (shared[0] of iterable) {
        yield shared
        shared[1]++
    }
}

console.log('iterate values and indexes from a generator')
for (const [val, i] of eachWithIndex(eachFromTo(10, 13))) console.log(val, i)

console.log('create an array')
const anArray = eachToArray(eachFromTo(10, 13))
console.log(anArray)

console.log('iterate values and indexes from an array')
for (const [val, i] of eachWithIndex(anArray)) console.log(val, i)

발전기의 장점은 게으르고 다른 발전기의 결과를 논쟁으로 삼을 수 있다는 것입니다.

, 가장 가 뛰어난 은 ES6의 .entries여기에서는 많은 dev에 대해 제약이 있는 것 같아서 perf benchamrk를 만들었습니다.

6배 이상 빨라요.a) 어레이에 여러 번 액세스하고 b) 인덱스를 캐스트할 필요가 없기 때문입니다.

(느린) 프라임 검색의 예와 함께 인덱스와 통과된 제너레이터 함수의 값을 생성하는 복합 반복기 버전입니다.

const eachWithIndex = (iterable) => {
  return {
    *[Symbol.iterator]() {
      let i = 0
      for(let val of iteratable) {
        i++
          yield [i, val]
      }
    }
  }

}

const isPrime = (n) => {
  for (i = 2; i < Math.floor(Math.sqrt(n) + 1); i++) {
    if (n % i == 0) {
      return false
    }
  }
  return true
}

let primes = {
  *[Symbol.iterator]() {
    let candidate = 2
    while (true) {
      if (isPrime(candidate)) yield candidate
        candidate++
    }
  }
}

for (const [i, prime] of eachWithIndex(primes)) {
  console.log(i, prime)
  if (i === 100) break
}

언급URL : https://stackoverflow.com/questions/10179815/hot-to-get-the-loop-counter-index-using-for-of-syntax-in-javascript