Syntax: for(variable of iterable){ }
•
이터러블 오브젝트를 반복합니다.
const list = [1, 2, 3];
for(let k = 0; k < list.length; k++){
console.log(list[k]);
};
for(let value of list){
console.log(value);
};
JavaScript
복사
•
iterable
◦
이터러블 오브젝트를 작성
◦
표현식을 작성하면 평가 결과를 사용합니다.
•
variable
◦
변수 이름 작성
◦
이터러블 오브젝트를 반복할 때마다 variable에 값이 할당됩니다.
•
배열
◦
배열을 반복하며 엘리먼트를 하나씩 전개합니다.
for( let value of [1,2,3]){
console.log(value);
}
JavaScript
복사
•
String
◦
문자열을 반복하면서 문자를 하나씩 전개합니다.
for( let value of "ABC"){
console.log(value);
}
JavaScript
복사
[실행 결과]
A
B
C
•
NodeList
◦
NodeList를 반복하며 엘리먼트를 하나씩 전개
<ul>
<li class="show">첫 번째</li>
<li class="show">두 번째</li>
<li class="show">세 번째</li>
</ul>
HTML
복사
const nodes = document.querySelectorAll(".show");
for(let node of nodes){
console.log(node.textContent);
};
JavaScript
복사
for-in, for-of차이점
•
for-in
◦
열거 가능한 프로퍼티가 대상입니다.
◦
{key: value}형태는 디폴트가 enumerable: true
◦
Object.defineProperty()는 디폴트가 enumerable: false
const obj = { };
Object.defineProperties(obj, {
sports:{
enumerable: false, value: "스포츠"
},
book: {
enumerable: true, value: "책"
},
});
for(let item in obj){
console.log(item + ": " + obj[item]);
};
JavaScript
복사
•
for-of
◦
이터러블 오브젝트가 대상
◦
Object는 전개되지 않습니다.
◦
prototype의 프로퍼티도 전개
◦
되지 않습니다.
for-of, Object
•
Object는 이터러블 오브젝트가 아니기에 for-of 사용이 불가능합니다.
•
하지만 Object.keys()로 프로퍼티 이름을 배열로 만든 뒤 만든 배열을 for-of로 전개하면 사용가능합니다.
const sports ={
soccer: "축구",
baseball: "야구"
};
const keyList = Object.keys(sports);
for(let key of keyList){
console.log(key + ": " + sports[key]);
};
JavaScript
복사
