inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

함수형 프로그래밍과 JavaScript ES6+

사용자 정의 이터러블, 이터러블/이터레이터 프로토콜 정의

강의 1분40초쯤, iterable 객체 안에

해결된 질문

438

whysee Song

작성한 질문수 1

2

[Symbol.iterator]() {

...

}

라고 메소드명을 대괄호로 묶었는데 이건 왜그런건가요?

 

함수형-프로그래밍 javascript

답변 6

4

MDU 유인동

동적인 값을 key로 사용하고자 하면 해당 방법을 사용해야합니다.

감사합니다.

2

unchaptered

코린이인 저보다 훨씬 선배님이 되셨겠지만, 조심스럽게 제 생각을 적어봅니다.
작동 원리는 모르겠으나, 결론부터 말씀드리자면 그냥 그렇게 약속되었기 떄문 이라고 봅니다.

질문인 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

MDU 유인동

예제에서 처럼 심볼을 키로 사용하고자 할 때에도 대괄호를 사용합니다. ^^

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

SooJae

well-formed iterator는 재귀호출이 가능하다고 해야 하나요? 재귀함수를 갖고 있다고 해야하나요?
아니면 달리 표현할 말이 있나요?

0

whysee Song

아하 답변 감사합니다!

프론트엔드 실무에서 어떤때에 쓰이는지 궁금합니다

1

111

1

함수형 프로그래밍 심화 강의 자료 추천

0

72

2

함수형 자바스크립트 프로그래밍 책

0

54

1

filter가 아무것도 걸러내지 못하는 경우

0

114

1

take 함수의 성능적면에서의 이점

1

463

1

pipe함수

1

531

1

Identity 함수

0

451

1

함수형 프로그래밍이란

0

832

1

reduce 예제 코드 제안!

0

405

1

fxts를 배워보려고 합니다.

1

537

1

flatMap 관련 질문드립니다~

1

444

1

다용성이 높은 L.flatMap

0

358

1

변수에 재 할당 금지~

0

540

1

DevTools라고 옆에 결과 확인하는거 어떻게 하나요?

0

483

2

소요시간에 관해서 질문드립니다

1

458

1

join에 대한 내용이 궁금증이 해결되지 않아서 질문드립니다!

0

465

2

reduce에 L.range를 사용할 때

0

527

2

[이해내용 공유] Lazy 에서 C.reduce가 병렬 효과를 내는 이유

3

739

2

제가 이해한 C.Reduce와 Reduce의 동작 차이 정리

2

787

3

go, pipe 함수 관련하여 질문 드립니다.

1

499

1

안녕하세요 강사님!

0

380

2

fxts에 go가 없는 이유?

0

840

1

비동기 관련 질문입니다!

0

462

1

질문 있습니다.

0

517

1