인프런 커뮤니티 질문&답변
작성한 질문수
강의 1분40초쯤, iterable 객체 안에
해결된 질문
작성
·
315
2
[Symbol.iterator]() {
...
}
라고 메소드명을 대괄호로 묶었는데 이건 왜그런건가요?
답변 6
4
2
코린이인 저보다 훨씬 선배님이 되셨겠지만, 조심스럽게 제 생각을 적어봅니다.
작동 원리는 모르겠으나, 결론부터 말씀드리자면 그냥 그렇게 약속되었기 떄문 이라고 봅니다.
질문인 iterator 가 담긴 객체 에 대한 의문을 풀기 위해,
일반적인 iterable 인 배열을 기준으로 먼저 생각해보면,
배열이 생성될 때는 명시적 생성자 호출 혹은 리터럴 표기법 등을 통하게 되며, 생성된 배열은 빌트인 객체인 Array 의 프로토타입이 되게됩니다.
여기서 잠깐 공식문서를 보면, 여기서는 프로퍼티 와 메서드 를 명확하게 구분하고 있습니다.
이를 보고 생각해보면 임의 배열이 담긴 변수 arr 에서
arr.length 는 배열의 프로퍼티 를 호출한 것이지만,
arr.forEach 는 배열의 메서드 를 호출한 것이라고 생각합니다.
그렇다면 왜 아래 친구가 메서드 로 불리는 지에 대해서 생각해보면 기본적으로 함수 이며, 이러한 함수는 실행 컨텍스트 에서 thisBinding 이 스코프 영역에 걸리게 됩니다.
내부 로직상 어떠한 식별자로 기록되는 지 모르나, iterator 또한 내부에 함수 를 담고 있으며 따라서 가장 가까운 스코프인 자신을 향해 thisBinding 이 되게 됩니다.
이렇듯,
애초에 이 친구는 프로퍼티 가 아닌 메서드 의 관점에서 보는 것이 옳지 않을까 라는 생각입니다.
+ 애초에 공식 문서에 적혀있는 문법이기도 하구요...
추가적으로
객체 프로퍼티 접근법 이외의 방법으로도 프로퍼티를 호출할 수 있음을 시사하는 부분이 유사객체배열 이 있는 것 같은데요.
const arr = { 0: 'hello' };
console.log(arr[0]); // hello
console.log(arr.0); // error
위와 같은 사용 방법은 아실 거라고 생각합니다.
여기서 0 을 username 으로 바꾸면 일반적인 객체처럼 보이게 되는데요. 이 또한 배열을 호출하듯이 값을 불러낼 수 있습니다.
const arr = { username: 'hello' };
console.log(arr['username']); // hello
console.log(arr.username); // hello
즉, 객체 프로퍼티 접근법 뿐만 아니라 일반적인 배열식의 호출 방법 도 정상 작동을 하며, 이 방법이 조금 더 광범위하다는 것을 알 수 있었습니다.
다만 의문인 부분은 어덯게 Symbol.iterator 라는 친구를 그 안에 넣었을 때, 메모리 상의 주소를 찾아가는 가 라는 부분이었습니다만. 그 부분은 문서에서 찾지 못하였습니다.
1
0
안녕하세요 심도 깊은 강의를 잘 보고 있습니다.
감사합니다.
위에 질문과 답변에 이은 질문인데요
const iterable = {
[Symbol.iterator] : function () {
let i = 3;
return {
next () { } ,
[Symbol.iterator]: function () { return this ; }
}
}
}
이렇게 위와 같이 풀어서 표현이 가능하다고 봅니다.
그런데 왜 iterable 객체의 메소드인 [Symbol.iterator] 를 실행하려면 아래와 같이 사용하는지 궁금 합니다.
let iterator = iterable[Symbol.iterator]();
원래 객체 프로퍼티 접근법으로는
let iterator = iterable.[Symbol.iterator]() 이거나
let iterator = iterable[[Symbol.iterator]]() 으로 표현되는게 기본적인 접근이나 실행법으로 알고 있는데
악상 위와 같이 하면 에러가 발생합니다.
Symbol 객체를 프로퍼티로 가지고 있는 Object 에서
해당 Object 의 프로퍼티나 메소드를 접근하려면 별도로 정해진 문법으로 정해진 건지 궁금합니다.
0
0