[javascript] ES6 : for... in, for...of 비교

for...in문은 객체의 모든 열거 가능한 속성을 반복한다.

Object.prototype.objCustom = function () {}; 
Array.prototype.arrCustom = function () {}; 
let iterable = [3, 5, 7]; 
iterable.foo = "hello"; 
for (let i in iterable) { 
	console.log(i); 	// logs 0, 1, 2, "foo", "arrCustom", "objCustom" 
}

for...of문은 모든 객체가 아닌 컬랙션만 반복한다.. Symbol.interator 속성이 있는 컬렉션의 프로퍼티를 반복한다. 

Object.prototype.objCustom = function () {}; 
Array.prototype.arrCustom = function () {}; 
let iterable = [3, 5, 7]; 
iterable.foo = "hello"; 
for (let i of iterable) { 
	console.log(i); // logs 3, 5, 7
}

for ... in 문에서 추가한 프로퍼티를 포함해서 루프를 돌기 때문에 프로퍼티를 출력하지 않기 위해서는 위의 for ... in 문을 아래와 같이 작성해야 합니다.

Object.prototype.objCustom = function () {}; 
Array.prototype.arrCustom = function () {}; 
let iterable = [3, 5, 7]; 
iterable.foo = "hello"; 
for (let i = 0; i < iterable.length; i++) { 
	console.log(iterable[i]); // 3, 5, 7 
}

 

출처 : beomy.tistory.com/20