…의 인덱스 / 키를위한 TypeScript?

여기에 설명 된 것처럼 TypeScript는 foreach 루프를 소개합니다.

var someArray = [9, 2, 5];
for (var item of someArray) {
    console.log(item); // 9,2,5
}

그러나 색인 / 키가 없습니까? 나는 다음과 같은 것을 기대할 것이다.

for (var item, key of someArray) { ... }

.forEach 이미이 능력이 있습니다 :

const someArray = [9, 2, 5];
someArray.forEach((value, index) => {
    console.log(index); // 0, 1, 2
    console.log(value); // 9, 2, 5
});

그러나의 기능을 원한다면 인덱스와 값으로 배열을 for...of할 수 있습니다 map.

for (const { index, value } of someArray.map((value, index) => ({ index, value }))) {
    console.log(index); // 0, 1, 2
    console.log(value); // 9, 2, 5
}

조금 길어서 재사용 가능한 함수에 넣는 것이 도움이 될 수 있습니다.

function toEntries<T>(a: T[]) {
    return a.map((value, index) => [index, value] as const);
}

for (const [index, value] of toEntries(someArray)) {
    // ..etc..
}

반복 가능한 버전

--downlevelIteration컴파일러 옵션으로 컴파일하면 ES3 또는 ES5를 대상으로 지정할 때 작동 합니다.

function* toEntries<T>(values: T[] | IterableIterator<T>) {
    let index = 0;
    for (const value of values) {
        yield [index, value] as const;
        index++;
    }
}

Array.prototype.entries ()-ES6 +

ES6 + 환경을 대상으로 할 수 있으면 Arnavion의 답변에.entries() 설명 된 방법을 사용할 수 있습니다 .

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/entries

for (var [key, item] of someArray.entries()) { ... }

TS에서는 ES5 런타임이 지원 하지 않는 반복자를 지원하기 위해 런타임 이 필요하므로 ES2015를 타겟팅 해야합니다 . 물론 Babel 과 같은 것을 사용 하여 ES5 런타임에서 출력이 작동하도록 할 수 있습니다 .

구식의 "오래된 학교 자바 스크립트"(기능 프로그래밍에 익숙하지 않거나 익숙하지 않은 사람들을 위해)

for (let i = 0; i < someArray.length ; i++) {
  let item = someArray[i];
}

for..in TypeScript 연산자를 사용하여 컬렉션을 다룰 때 인덱스에 액세스 할 수 있습니다 .

var test = [7,8,9];
for (var i in test) {
   console.log(i + ': ' + test[i]);
} 

산출:

 0: 7
 1: 8
 2: 9

데모 보기

또는 다른 구식 솔루션 :

var someArray = [9, 2, 5];
let i = 0;
for (var item of someArray) {
    console.log(item); // 9,2,5
    i++;
}