ES6 의 for... of 와 for... in

먼저 옮 겨 다 니 는 기 (Iterator) 는 인터페이스 로 다양한 데이터 구조 에 통 일 된 접근 체 제 를 제공 합 니 다.모든 데이터 구 조 는 Iterator 인 터 페 이 스 를 배치 하면 옮 겨 다 니 기 작업 을 완성 할 수 있 습 니 다 (즉, 이 데이터 구 조 를 순서대로 처리 하 는 모든 구성원).
Iterator 의 역할 은 세 가지 가 있 습 니 다. 하 나 는 각종 데이터 구 조 를 위해 통일 적 이 고 간편 한 방문 인 터 페 이 스 를 제공 하 는 것 입 니 다.둘째, 데이터 구조의 구성원 들 이 특정한 순서에 따라 배열 할 수 있 도록 하 는 것 이다.셋째, ES6 는 새로운 스 트 리밍 명령 for...of 순환 을 만 들 었 고 Iterator 인 터 페 이 스 는 주로 for...of 소 비 를 제공 했다.
Iterator 의 옮 겨 다 니 는 과정 은 이 렇 습 니 다. 먼저 포인터 대상 을 만 들 고 현재 데이터 구조의 시작 위 치 를 가 리 킵 니 다.즉, 스 트 리밍 대상 은 본질 적 으로 지침 대상 이다.지침 대상 next 방법 은 지침 을 이동 하 는 데 쓰 인 다.시작 할 때 포인터 가 배열 의 시작 위 치 를 가리킨다.그리고 매번 호출 next 방법 을 사용 할 때마다 지침 은 수조 의 다음 구성원 을 가리킨다.next 방법 은 현재 데이터 구성원 의 정 보 를 나타 내 는 대상 을 되 돌려 줍 니 다.이 대상 은 value 와 done 두 개의 속성 을 가지 고 있 으 며, value 속성 은 현재 위치 로 돌아 가 는 구성원 입 니 다. done 속성 은 하나의 불 값 입 니 다. 옮 겨 다 니 는 것 이 끝 났 는 지, 즉 다시 호출 할 필요 가 있 는 지 next 방법 입 니 다.한 마디 로 지침 대상 next 을 호출 하 는 방법 은 미리 정 해진 데이터 구 조 를 옮 겨 다 닐 수 있다.
Iterator 인터페이스의 목적 은 모든 데이터 구 조 를 위해 통 일 된 접근 체 제 를 제공 하 는 것 이다. for...of 순환 으로 특정한 데이터 구 조 를 옮 겨 다 닐 때 이 순환 은 자동 으로 Iterator 인 터 페 이 스 를 찾 는 것 이다.일종 의 데이터 구조 가 Iterator 인 터 페 이 스 를 배치 하면 우 리 는 이러한 데이터 구 조 를 '옮 겨 다 닐 수 있 는' (iterable) 이 라 고 부른다.
ES6 에 따 르 면 기본 Iterator 인 터 페 이 스 는 데이터 구조의 Symbol.iterator 속성 에 배치 되 거나 하나의 데이터 구 조 는 Symbol.iterator 속성 만 있 으 면 '옮 겨 다 닐 수 있 는' (iterable) 이 라 고 볼 수 있다.
ES6 의 일부 데이터 구 조 는 원래 Iterator 인터페이스 (예 를 들 어 배열) 를 갖 추고 있 는데, 즉 어떠한 처리 도 하지 않 아 도 for...of 순환 되 어 옮 겨 다 닐 수 있다.
원생 Iterator 인 터 페 이 스 를 갖 춘 데이터 구 조 는 다음 과 같다.

Array

Map

Set

String

TypedArray

함수 의 arguments 대상

NodeList 대상

대상 (Object) 이 Iterator 인 터 페 이 스 를 기본 으로 배치 하지 않 은 이 유 는 대상 의 어떤 속성 이 먼저 옮 겨 다 니 고 어떤 속성 이 옮 겨 다 니 는 지 확실 하지 않 기 때문에 개발 자가 수 동 으로 지정 해 야 합 니 다.한 대상 이 for...of 순환 호출 이 가능 한 Iterator 인 터 페 이 스 를 갖 추 려 면 Symbol.iterator 속성 에 스 트 리밍 기 생 성 방법 을 배치 해 야 합 니 다.
문자열 은 배열 과 유사 한 대상 이 며, 원생 으로 Iterator 인터페이스 가 있 습 니 다.모든 유사 한 배열 의 대상 이 Iterator 인 터 페 이 스 를 가지 고 있 는 것 은 아니 며, 간단 한 해결 방법 은 Array.from 방법 으로 배열 로 바 꾸 는 것 이다.
본질 적 으로 스 트 리밍 기 는 일종 의 선형 처리 로 그 어떠한 비 선형 데이터 구조 에 대해 스 트 리밍 기 인 터 페 이 스 를 배치 하 는 것 은 일종 의 선형 전환 을 배치 하 는 것 과 같다. 
다음은 본론 으로 들 어 갑 니 다.
ES6 는 모든 데이터 구 조 를 옮 겨 다 니 는 통 일 된 방법 으로 for...of 순환 을 도입 했다.
하나의 데이터 구 조 는 Symbol.iterator 속성 을 배치 하면 iterator 인 터 페 이 스 를 가 진 것 으로 간주 되 고 for...of 순환 으로 구성원 을 옮 겨 다 닐 수 있다.즉, for...of 내부 순환 호출 은 데이터 구조의 Symbol.iterator 방법 이다.하나의 데이터 구 조 는 Symbol.iterator 속성 을 배치 하면 iterator 인 터 페 이 스 를 가 진 것 으로 간주 되 고 for...of 순환 으로 구성원 을 옮 겨 다 닐 수 있다.즉, for...of 내부 순환 호출 은 데이터 구조의 Symbol.iterator 방법 이다.
for... of, Set 구 조 를 사용 할 때 하나의 값 을 되 돌려 줍 니 다. Map 구 조 를 사용 할 때 하나의 배열 을 되 돌려 줍 니 다. 이 배열 의 두 구성원 은 현재 Map 구성원 의 키 이름과 키 입 니 다.
문자열 에 있어 서 for...of 순환 은 32 비트 UTF - 16 문 자 를 정확하게 식별 하 는 특징 도 있다.
일반적인 대상 에 대해 서 는 for...of 구 조 를 직접 사용 할 수 없고 오류 가 발생 할 수 있 으 며, Iterator 인 터 페 이 스 를 배치 해 야 사용 할 수 있다.그러나 이 경우 for...in 순환 은 키 이름 을 옮 겨 다 닐 수 있다.
for... of 를 사용 하여 대상 을 순환 하려 면 Object.keys 방법 으로 대상 의 키 이름 을 배열 로 만 든 다음 이 배열 을 옮 겨 다 니 는 것 이 해결 방법 입 니 다.

for (var key of Object.keys(obj)) {
  console.log(key + ': ' + obj[key]);
}

JavaScript 기 존의 for...in 순환 은 대상 의 키 만 얻 을 수 있 고 키 값 을 직접 가 져 올 수 없습니다.ES6 는 키 값 을 얻 을 수 있 도록 순환 for...of 을 제공 합 니 다.for...in 키 이름 을 순환 적 으로 읽 고 for...of 키 값 을 순환 적 으로 읽 습 니 다.for...of 순환 을 통 해 배열 의 색인 을 얻 으 려 면 배열 인 스 턴 스 entries 방법 과 keys 방법 을 빌 릴 수 있 습 니 다.마찬가지 로 for... in 순환 을 통 해 대상 의 키 값 을 얻 으 려 면 아래 코드 와 같은 방법 이 있 습 니 다. 

let es6 = {
    name:"Clarence_W",
    age:25,
    job:"coder"
}

for(let item in es6) {
    console.log(item,es6[item]);
}

//name Clarence_W
//age 25
//job coder

 for... in 의 몇 가지 단점 을 말 해 보 세 요.
1. for... in 순환 배열 을 사용 하면 색인 값 을 되 돌려 주 고 색인 값 은 문자열 형식의 숫자 입 니 다.
2. for...in 순환 은 디지털 키 이름 뿐만 아니 라 수 동 으로 추 가 된 다른 키 도 옮 겨 다 니 고 심지어 원형 체인 의 키 도 포함한다.
3. 일부 상황 에서 옮 겨 다 니 는 순 서 는 실제 배열 의 내부 순서 가 아 닐 수도 있다.
그래서 몇 가지 단점 을 종합해 보면 for... in 은 배열 을 옮 겨 다 닐 수 있 지만 배열 을 옮 겨 다 니 지 않 는 것 이 좋 습 니 다. 대상 을 옮 겨 다 니 기 에 더욱 적합 합 니 다.
이렇게 많이 했 으 니 모두 for... of 가 얼마나 좋 은 지 비교 해 보면 이전의 순환 보다 확실히 유리 하 다. 예 를 들 어 foreach 는 순환 에서 벗 어 나 지 못 하고 for.. of 는 break, continue 와 return 와 함께 사용 할 수 있다.
 
많은 지식 들 이 for... of 와 for... in 처럼 for... of 는 배열 을 옮 겨 다 니 고 for.. in 은 대상 을 옮 겨 다 니 는데 사용 할 수 있 습 니까? 바 꿔 서 사용 하 는 데 무슨 문제 가 있 을 까요? 많은 사람들 이 모 를 수도 있 습 니 다. 개인 적 으로 그 원 리 를 좀 더 알 아야 한다 고 생각 합 니 다. 두 번 이나 보고 이해 하지 못 하 더 라 도 기억 하지 못 하 더 라 도 괜 찮 습 니 다.스스로 한번 해 보고 이론 을 결합 하면 많이 좋아 질 것 이다.
앞쪽 의 길이 아직 멀 고 길이 멀 어서 나 는 위아래 로 찾 을 것 이다.