[JS] for of문에서의 배열 인덱스 사용

[BaekJoon] 2309 일곱난쟁이 (node.js)

• 요 문제를 보다가 기본적인 for문을 통해 배열을 순회하고 있는 것을 보고 의문이 들었다.
  기본적인 for문과 forEach, for in문에서 가능한 것처럼 for of문에서도 배열 인덱스를 사용할 수 있지 않을까?
• 결론부터 말하자면 Array.prototype.keys()나 entries()를 활용하는 방법이 있었다.
  이 글은 다음과 같은 사람에게 도움이 될 것으로 보인다.
  1. 기본적인 for 문의 문법이 너무 어려워 사용 방법을 까먹은 사람
  2. 누군가 목에 칼을 들이밀고 for of문만을 사용한 배열 순회를 강요하는 상황에 처한 사람

 

• 우선, 기본적인 for문과 forEach, for in 문을 사용한 순회는 다음과 같은 방식이 있다. 이 방법은 모두 같은 결과를 반환한다

const arr = [ 'a', 'b', 77, true ];

// 1. 기본적인 for문을 활용한 순회
for(let index = 0; index < arr.length; index++) {
    console.log(`[${index}] = ${arr[index]}`);
}

// 2. Array.prototype.forEach를 활용한 순회
arr.forEach((element, index) => {
    console.log(`[${index}] = ${element}`);
});

// 3. for in문을 활용한 순회
for(const index in arr) {
    console.log(`[${index}] = ${arr[index]}`);
}​

• 이제 Array.prototype.keys()와 Array.prototype.entries()를 활용하며 배열을 순회해보자.

// 4. Array.prototype.keys()를 활용한 순회
const indexes = arr.keys();
for(const index of indexes) {
    console.log(`[${index}] = ${arr[index]}`);
}

// 5. Array.prototype.entries()를 활용한 순회
const elements = arr.entries();
for(const [ index, element ] of elements) {
    console.log(`[${index}] = ${element}`);
}

• 이터레이터를 반환하는 두 메소드를 통해 for of에서도 간접적으로 인덱스를 사용할 수 있다.

 

결론

• 위 다섯가지 방법 중 무엇을 사용할지, 선택은 본인의 몫이다.
• 각 방식의 속도는 for > forEach > for of 순으로 나타나는 것을 링크에서 확인할 수 있다.
  당연히 keys()나 entries()를 호출해서 굳이 이터레이터를 만드는 4, 5번 방식은 저 셋보다 느리면 느렸지 결코 빠르진 않을 것이다.
• 그러나 위 링크에서도 강조하듯, 우리는 실행 속도 외에도 코드 가독성 등, 따져야할 것 들이 많이 있다.
  무엇보다, 나는 그냥 for of가 좋다.

- 끝 -