JavaScript 정리-2 for..of / for...in

프로그래머스 풀며 정리(2)

for of
이터러블을 순회하면서 이터러블의 요소를 변수에 할당한다.

const array1 = ['a', 'b', 'c'];

for (const element of array1) {
  console.log(element);

for in
객체의 프로토타입 체인 상에 존재하는 모든 프로토타입의 프로퍼티 중에서 프로퍼티 어트리뷰트[[Enumerable]]의 값이 true인 프로퍼티를 순회하며 열거한다.
인덱스의 순서가 중요한 배열에서 반복을 위해 사용할 수 없다.

const person = {
	name: 'Lee',
  address: 'Seoul',
  __proto__: { age : 20}
 };


for(const key in person) {
  console.log(key + ': ' + person[key]);
}

//'name: Lee'
//'address: Seoul'
//'age: 20'

const sym = Symbol();
const obj = {
  a: 1,
  [sym]:10
};

for (const key in obj) {
  console.log(key + ': ' + obj[key]);
}

// a: 1

for...of for...in 차이점

let forIn =[];
let forOf =[];

let iterable = [3, 5, 7];
iterable.foo = "hello";

for (let i in iterable) {
  forIn.push(i);
}
console.log(forIn)
//[ '0', '1', '2', 'foo' ]


for (let i of iterable) {
 forOf.push(i)
}
console.log(forOf)
//[ 3, 5, 7 ]

for...in 루프는 객체의 모든 열거가능한 속성에 대해 반복
for...of [Symbor.iterator] 속성이 있는 모든 컬렉션 요소에 대해 반복