일단 enumerable과, iterable에 대해 알아보자.
1. enumerable
셀수 있는가
true 혹은 false로 말해줌..
2. iterable
순회 가능한
for ( let a in 대상 ) 반복문 _____ (object 에서 쓰인다. )
1. enumerable 한 것만 반복해 준다.
👉 enumerable 한 것인지 확인하는 방법
👀👉👉 Object.getOwnPropertyDescriptor(obj, key).enumerable
let obj = {name : 'kim', age : 30};
Object.getOwnPropertyDescriptor(obj, 'name')
{value: 'kim', writable: true, enumerable: true, configurable: true}
❓❓ object 아닌데 나는 꼭 for~in 을 사용하고 싶은뎀...??
👉 for~ in을 사용하고 싶은 그 대상의 요소들을 하나하나 꺼내서 object에 넣어준 다음 사용하면 된다.
2. 부모의 프로토타입도 같이 출력해준다.
나는 해당 오브젝트를 반복하면서 내용을 출력했을 뿐인데, 프로토타입에 숨겨진 내용도 출력이 되버린다.
아래 예제를 봐보자.
class prototo {}
prototo.prototype.name = 'park';
let obj = new prototo();
console.log(obj);
for(let k in obj){
if(obj.hasOwnProperty(k)){ //직접 가지고 있는 키값만 출력해줘.
console.log(obj[k]); //당연히 없으니까 출력 안됨.
}
console.log(obj[k]) // 결과는 park 출력됨. 부모 프로퍼티 가져온거.
}
for ( let a of 대상 ) 반복문 _____ (iterable 한 것들에서 쓰인다. )
let aaaaa = [1,2,3,4,5];
for(let key of aaaaa){
console.log(key) //1 2 3 4 5
}
1. iterable 한 것들은 어떤게 있을까?
👉 문자열, 배열, arguments, NodeLIst, Map, Set 같은 주어진 순서대로 데이터 표현이 가능한 것들.
간단한 배열로 for of 반복문을 돌린 예시를 봐보자.
2. iterable 한 것인지 어떻게 확인해 볼 수 있을까?
확인하려는 대상[Symbol.iterator]();
을 이용하면 확인 할 수 있다.
예를 들면, iterable 한 배열과, 아까 위에서 enumerable하다고 다룬 obj를 시도해 보겠다.
let aaaaa = [1,2,3,4,5];
aaaaa[Symbol.iterator]();
//콘솔창에는
//Array Iterator {}[[Prototype]]: Array Iteratornext: ƒ next()Symbol(Symbol.toStringTag): "Array Iterator"[[Prototype]]: Object
let bbbbb= {name : 'juho'};
bbbbb[Symbol.iterator]();
//콘솔창에는
//Uncaught TypeError: bbbbb[Symbol.iterator] is not a function
iterator한 array는 잘 확인이 되지만.
enumerable 한 obj 는 에러가 나온다.
이렇게 우리는 [Symbol.iterator]() 를 통해 iterator한 것인지 확인해 볼 수 있다.
🌟기억하자!!🌟
for of iterator
for in enumerable
'JS (Java Script)' 카테고리의 다른 글
Map 자료형 (0) | 2023.09.14 |
---|---|
Symbol 이란?? (0) | 2023.09.13 |
프로미스 패턴 없이 프로미스 만들기. async 와 await (0) | 2023.09.13 |
ES6 프로미스 패턴 !!("콜백지옥" 으로 부터 탈출) (0) | 2023.09.13 |
자바스크립트 동기 ? 비동기? __ 코드가 웹 브라우저 에서 동작하는 과정.(씽글쓰레드, 멀티쓰레드 찍먹하기) (0) | 2023.09.12 |